• 0

Images for radio options


Question

Hello!

I've been creating a script similiar to a 5 star rating for for how someone feels about that particular thing. So I have images for each mood like a smiley face and frown face. I want it to look like this:

30wmbf8.png

But I'm having to use radio options that post when clicked to send the information. Since I can't use <a> tags and style them like the original photo and post in the form, how can i get these buttons?

Here is how it looks now:

2wpjr6w.png

Link to comment
Share on other sites

4 answers to this question

Recommended Posts

  • 0

I would do this using javascript (jQuery).

put your 5 images... and add 5 radio buttons, but use CSS so they're hidden.

And on image click... have javascript 'click' the corresponding radio button.

Get what I mean?

Link to comment
Share on other sites

  • 0

Do you want to try to reinvent a rating system or would you be okay with using something someone else developed? All you would need to do is replace any images/styling with your own. :)

jQuery:

http://net.tutsplus.com/tutorials/html-css-techniques/building-a-5-star-rating-system-with-jquery-ajax-and-php/

http://code.google.com/p/jquery-star-rating-plugin/ * Radio Options

Prototype:

http://www.nickstakenburg.com/projects/starbox/

No library:

http://colorpowered.com/colorrating/

Link to comment
Share on other sites

  • 0

Well I kind of did it in a bootleg way. It works but it may not be valid. lol. I replaced the radio options with buttons and styled them. They have the same name but the value is different so it does post correctly. This website isn't going to be a public thing, it's just for my bpa competition, and they know nothing about coding anyway so what's bootleg won't hurt.

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.