有没有一种方法可以实现 5 星评级控件，支持在悬停时更改 5 星的图像，而不使用 Javascript？单击需要执行 HTTP POST
为了更好地理解，我搜索了示例并找到了 http:// /orkans-tmp.22web.net/star_ rating/ （滚动到“带有 SELECT 选项的快速示例”）
就我对 HTML 的了解而言，不可能有多个图像/按钮来执行一个帖子（知道哪个由用户给出评分），并同时更改多个背景图像。
Is there a way to implement a 5-star rating control, that supports changing the images of the 5 stars upon hover, without the use of Javascript? A click would need to perform a HTTP POST
To get a better understanding I searched for a sample and found http://orkans-tmp.22web.net/star_rating/ (Scroll to "Quick example with SELECT options")
As far as my knowledge of HTML goes, it is not possible to have multiple images / buttons that perform a Post (to know which rating was given by the user), and simultaneously change multiple background images.
发布评论
评论（3）
的示例
以下是 CSS3 Secrets jsfiddle
您可以使用 css 选择器来完成您想要的操作，而无需使用 javascript。
Here is an example from CSS3 Secrets
jsfiddle
You can use css selectors to get what you want done without javascript.
您可以使用 CSS 更改图像。只需应用一个类并为其提供 :hover 选项即可。
IE
.star:悬停
{
颜色：蓝色；
我假设
您希望所有以前的星星在悬停时也改变颜色，这是可能的，但相当困难。我们将从 5 个起始点的图像（全部突出显示）和一个未突出显示的起始点的图像开始。将五个未突出显示的起始位置放在彼此的顶部（设置绝对位置）。调整星星的意图，使每颗星星都比最后一颗星星缩进更多，并且它们布局正确（实际上没有相互重叠）。在悬停时添加一个 CSS，每个 CSS 都不同。需要将图像替换为 5 星突出显示的图像。需要设置宽度，以便仅显示适当数量的星星。需要设置 z 索引，使其位于所有先前恒星的未突出显示图像的顶部。
You can change the image using CSS. Just apply a class and give it the :hover option.
i.e.
.star:hover
{
color:blue;
}
I assume that you would want all previous stars to change color as well on hover, this would be possible, but quite difficult. We'll start with an image of 5 starts (all highlighted) and an image of a single unhighlighted start. Place five of the unhighlighted starts right on top of each other (set the absolute postion). Adjust the intend of the stars so that each is indented more than the last and they are laid out properly (without actually overlapping each other). Add a CSS on hover that's different for each one. It will need to replace the image with the 5 stared highlighted image. The width will need to be set so that only the appropriate number of stars is shown. The z-index will need to be set so that it is on top of the unhighlighted images of all previous stars.
是否可以使用
OnMouseOver和OnMouseOut选项来创建相同的悬停效果？Is it possible 2 use the
OnMouseOverandOnMouseOutoption to create the same effect of a hover?