zoukankan html css js c++ java

五星评价

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{margin:0;padding:0;}
        ul{list-style:none;margin:30px auto;width:200px;}
        li{display:inline-block;width:19px;height:19px;background:url("3.png") no-repeat;}
        li.active{background:url("2.png") no-repeat;}
        li.lit{background:url("1.png") no-repeat;}
    </style>
</head>
<body>
<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
</body>
<script src="jquery-1.11.3.min.js"></script>
<script>
    $("li").each(function(){
        var $this=$(this);
        var $index=$this.index();
        $this.on("click",function(){
            if($index>2){
                $this.parent().find("li").removeClass("active");
                $this.parent().find("li").removeClass("lit");
                $this.addClass("active");
                $this.prevAll().addClass("active");
                $this.nextAll().removeClass("active");
            }else{
                $this.parent().find("li").removeClass("active");
                $this.parent().find("li").removeClass("lit");
                $this.addClass("lit");
                $this.prevAll().addClass("lit");
                $this.nextAll().removeClass("lit");
            }
        })
    })
</script>
</html>

查看全文

相关阅读:
Java打jar包详解
 用户体验评价
 本周总结（13）
本周总结（12）
第一阶段意见评论
 本周总结（11）
冲刺计划第十天
 冲刺计划第九天
 冲刺计划第八天
 冲刺计划第七天

原文地址：https://www.cnblogs.com/dongxiaolei/p/5864206.html