JS Code:
<script type= "Text/javascript" >
$ (function () {
//Concise user Rating code
$ (". Pfxtfen li"). Click (function () {
$ (this). addclass ("Pfxtcur");
$ (this). Prevall (). addclass ("Pfxtcur");
$ (this). Nextall (). Removeclass ("Pfxtcur");
$ (". Pfxtfen li"). DblClick (function () {
$ (". Pfxtfen li"). Removeclass ("Pfxtcur");}
)
</script>
Css
<style type= "Text/css" >
*{margin:0;padding:0 font-family: "Microsoft Ya Hei"}
ul{List-style:none;
/* User Rating
/* pingfenxitong{
padding:15px 0;
width:500px;
margin:0 Auto;
pingfenlist{
Float:left;
width:500px;
padding-right:20px
}
. pfxttitle{
Font-weight:bold;
Font-size:1.2em;
padding:4px 0;
}
. pfxttext{
line-height:25px
}
. pfxtfen{
margin:10px 0;
Pfxtfen li{
float:left;
width:98px;
height:30px;
Text-align:center;
line-height:30px;
border: #ddd 1px solid;
Background: #f1f1f1;
Cursor:pointer
}
. Pfxtfen li.pfxtcur{
background: #308A95;
Color: #fff;
border: #308A95 1px solid;
}
</style>
Html
<div class= "Pingfenxitong" > <div class= "pingfenlist" > <div class= "Pfxttitle" > Features:</div> < Div class= "Pfxttext" > Do you think the idea is excellent in function? </div> <ul class= "Pfxtfen" title= "double-click Cancellation Score" > <li>1</li> <li>2</li> <li>3< ;/li> <li>4</li> <li>5</li> <div class= "Clearfix" ></div> </ul> ;d IV class= "Pfxtright" ></div> <div class= "Clearfix" ></div> </div> <div class= "Pingfenl" ist > <div class= "pfxttitle" > Appearance:</div> <div class= "Pfxttext" > Do you think the idea is excellent in appearance? </div> <ul class= "Pfxtfen" title= "double-click Cancellation Score" > <li>1</li> <li>2</li> <li>3< ;/li> <li>4</li> <li>5</li> <div class= "Clearfix" ></div> </ul> <di V class= "Pfxtright" ></div> <div class= "Clearfix" ></div> </div> <div class= "Pingfenlist" ">;d IV class= "Pfxttitle" > Cost:</div> <div class= "Pfxttext" > Do you think the idea is excellent in cost? </div> <ul class= "Pfxtfen" title= "double-click Cancellation Score" > <li>1</li> <li>2</li> <li>3< ;/li> <li>4</li> <li>5</li> <div class= "Clearfix" ></div> </ul> <di V class= "Pfxtright" ></div> <div class= "Clearfix" ></div> </div> <div class= "Pingfenlist" "> <div class=" pfxttitle > Difficulty:</div> <div class= "Pfxttext" > Do you think the idea is feasible in the difficulty? </div> <ul class= "Pfxtfen" title= "double-click Cancellation Score" > <li>1</li> <li>2</li> <li>3< ;/li> <li>4</li> <li>5</li> <div class= "Clearfix" ></div> </ul> <di V class= "Pfxtright" ></div> <div class= "Clearfix" ></div> </div> <div class= "Clearfix" &G
T;</div> </div>
The above is the entire contents of this article, I hope you can enjoy.