Clickable box

Discussion in 'CSS' started by muffet, May 11, 2012.

  1. #1
    How do I make clickable container boxes using CSS3 like the boxes utilize on Kickstarter for project rewards? I'm trying to replicate this look for a WP fundraising plugin I use on my site. What is zenbox.css? :confused:
     
    muffet, May 11, 2012 IP
  2. coreygeer

    coreygeer Notable Member

    Messages:
    928
    Likes Received:
    310
    Best Answers:
    2
    Trophy Points:
    240
    Digital Goods:
    1
    #2
    What exactly do you want the clickable container boxes to do? I'm a little confused by your post there.

    If you're talking about that middle section where the content slides, that's more than likely done with jQuery and a little bit of CSS styling with Lists and Unordered lists

    Upon further inspection: It appears they are using jQuery among other scripts.

    If you're talking about the boxes that highlight when you hover over them, well that can be done with simple CSS and HTML writing (even though it can be handled by a CMS engine). Clarify exactly what you are looking to do so we can help you out better.
     
    coreygeer, May 12, 2012 IP
  3. muffet

    muffet Active Member

    Messages:
    720
    Likes Received:
    7
    Best Answers:
    4
    Trophy Points:
    68
    #3
    Well I want to achieve both actions actually; highlight the box when somebody hovers their mouse over a particular reward and make each of the boxes clickable to take a supporter immediately through the payment process via Paypal depending upon which $ amount they choose to contribute towards a project. Instead of being redirected to custom checkout page like Kickstarter. The WP fundraising plugin I using for my site utilizes radio buttons next to the reward amount, a text-input box to fill in the designated $ amount a supporter wishes to contribute if they choose None to opt-out of a reward and a Back this project button. The fundraiser widget which appears in the right side-bar I believe is written in CSS one of five styles for the fundraising widget is basic whose code is shown below:

    I want to change the appearance and function of the fundraising widget in the right side bar with custom css.
     
    muffet, May 14, 2012 IP