自动生成星级评定？

我试图找到一些方法将数字1 - 5转换成星级评分，它也可以包含小数点，如4.3或3.34，并且非常精确（如在Amazon.com上）。评级不一定要可用，它只是一个静态图像。任何帮助？自动生成星级评定？

我很好用PHP或jQuery的，无论它需要。

2011-05-04 AKor

这应该被标记'css' – andrewtweber 2011-05-04 23:04:24

你试图显示此或产生多少？请更具体一些。 – Flipper 2011-05-04 23:07:14

亚马逊只有全/半星评级显示。他们使用一个包含两个相关部分的精灵：一个十星级部分，五个部分填充，一个十星级部分填充4.5个部分。他们定位该背景图像，以便显示一定数量的完整段，并根据是否有半星来选择要使用哪个段。 – theazureshadow 2011-05-04 23:08:54

您可以创建一个带有透明星形切口的白色图像。然后将其放置在给定长度的黄色div的顶部。可以说你的图像宽度是100px。如果你有3星评级，你会使黄色格100 *（3/5）和3颗星将被填充。

编辑：一个类似的想法。你可以有一个图像与所有5星。将此图像放在带有溢出的div中：隐藏。然后你像上面一样设置div的宽度。分区越小，你会看到的星星越少。

EDIT2：只是为了好玩小提琴。您可以要求的所有粒度。 http://jsfiddle.net/qFMyC/

2011-05-04 23:03:05

梦幻般的答案 – 2011-05-05 02:26:58

这必须足以满足您的目的：

2011-05-04 23:05:06

我希望你的意思是打开1-5值转换成实际的星表示。

这取决于你想要的精细程度是，我认为亚马逊的是精确到十分之一的（0.1），这可能是实现服务器端，以节省客户端负载，并采取缓存图像的优势;但它可以在客户端完成。

@kingjiv贴好客户端的解决方案，但对于服务器端：

如果你不是太担心粒度，你可以创建11个图像0，0.5，1，1.5等等，等等，并通过价值进入图像的src属性。这将提供正确的图像，并且它们会很好地缓存，以便在您的网页上重复使用。

如果你想成为真正的颗粒状尽管你可以在代码服务器端创建它们，将它们缓存在创建每个准备迅速开始投放后的时间。用这种方法，你可以去任何你想象的准确度。

对于PHP，我建议在看Imagik

2011-05-04 23:09:50 Paystey

我过去所做的是创造2周的div并把他们在彼此的顶部。

在格设置宽度等于5星的宽度底部。所以，如果你的星星是50px宽，你的底部div是250px宽。

在顶部的div上，你使用不同颜色的同一颗星星。然后你在php或javascript中设置div的宽度为50 * $ decimalStarRating。

2011-05-04 23:27:50 ChrisChristensen

我前写这篇青睐。我痴迷于不使用JS。它需要一些工作，但我认为这正是你要找的。

http://yefomit.com/internet/simple_css_rater

2011-05-04 23:51:07 Tim

优秀的作品+写作 – 2011-05-05 02:28:21

回答