Comments on: Semantic HTML for a Simple 5-Star Rating System http://mattsnider.com/architecture/semantic-html-for-a-rating/ Understanding JavaScript and Frameworks Mon, 12 May 2008 10:40:35 +0000 http://wordpress.org/?v=2.1.2 By: the DtTvB http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-1615 the DtTvB Thu, 20 Dec 2007 02:43:56 +0000 http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-1615 Nice article! I never make use CSS to mask image. This article greatly shows it. At most time when I make a rating system, I used 2 image. Each image has one star. One for unstarred and another one for starred. I put them in 2 nested divs as a background-image and let it repeat. The outer div shows all the gray stars and the inner div shows the gold stars. PS: In the test page, without images, the rating just won't show. Missing alt="" maybe? Nice article! I never make use CSS to mask image. This article greatly shows it.

At most time when I make a rating system, I used 2 image. Each image has one star. One for unstarred and another one for starred. I put them in 2 nested divs as a background-image and let it repeat. The outer div shows all the gray stars and the inner div shows the gold stars.

PS: In the test page, without images, the rating just won’t show. Missing alt=”" maybe?

]]> By: admin http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-1616 admin Thu, 20 Dec 2007 02:50:55 +0000 http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-1616 DtTvB, thanks for commenting. I believe I fixed the issue you mentioned. The paths to the images were relative and should have been absolute. Let me know if you are still not seeing images. DtTvB, thanks for commenting. I believe I fixed the issue you mentioned. The paths to the images were relative and should have been absolute. Let me know if you are still not seeing images.

]]> By: the DtTvB http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-1629 the DtTvB Thu, 20 Dec 2007 08:43:03 +0000 http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-1629 Ok, I see the images now. ;)! Ok, I see the images now. ;)!

]]> By: Giappe http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-7546 Giappe Mon, 17 Mar 2008 10:27:54 +0000 http://mattsnider.com/architecture/semantic-html-for-a-rating/#comment-7546 Nice article. Another great use for CSS. I tried your testpage, however rescaling it would show a flaw, i.e. scaling larger than the background image would show the stars incorrectly (in FF 2.0.0.12). I would suggest using a background image 1px high and wide enough (say 1000px) to allow rescaling to enormous stars. Then having the background repeat-y. Having said this, I would like to thank you for sharing this idea, I am sure I will find a use for it in my future pages. Nice article. Another great use for CSS. I tried your testpage, however rescaling it would show a flaw, i.e. scaling larger than the background image would show the stars incorrectly (in FF 2.0.0.12). I would suggest using a background image 1px high and wide enough (say 1000px) to allow rescaling to enormous stars. Then having the background repeat-y. Having said this, I would like to thank you for sharing this idea, I am sure I will find a use for it in my future pages.

]]>