[development] create a star rater using css

Chris Messina chris.messina at gmail.com
Sat Jan 14 22:28:29 UTC 2006

Actually, the JS is not necessary for the functioning of the widget.
If you turn on and off styles in Firefox after clicking the different
ratings, you'll see that because I'm using labels, the values actually
change as you click -- no JS needed (except in Safari, which isn't
standards compliant).

You could add a submit button and the value of the rating would
actually get submitted.

The biggest issue is maintaining the rating once you've clicked -- so
either autosubmission would be good or just a little JS to change the
DOM as suggested or use AJAX to submit seamlessly... This approach is
actually much better than Amazon's, which was the inspiration for this
demo... they were actually using an iframe with table-aligned stars to
submit ratings... suck ass!

Anyway, a little JS isn't going to kill you -- especially when this
degrades to a very accessible format with labels and everything.


On 1/13/06, Jeff Eaton <jeff at viapositiva.net> wrote:
> Ber,
> I think his widget wasn't a demonstation of full submitting
> capabilities, but rather how a standards-compliant form element can be
> made to look like a spiffy rating-widget. Handling the actual submission
> of a rating would be handled as usual, I'd imagine.
> --Jeff
> > -----Original Message-----
> > From: Bèr Kessels [mailto:ber at webschuur.com]
> > Sent: Friday, January 13, 2006 12:45 PM
> > To: development at drupal.org
> > Subject: Re: [development] create a star rater using css
> >
> >
> > Op vrijdag 13 januari 2006 19:07, schreef Gabor Hojtsy:
> > > Ber, just view source on Chris' example. It is quite
> > obvious then, how
> > > it works.
> >
> > Jes.
> > It wont work without JS. And has no submit button. It does
> > not degrade.

More information about the development mailing list