jquery星級評分一顆星半顆心星級評分代碼



269 1073 358



特效描述:星級評分 一顆星半顆心 星級評分代碼,jquery星級評分代碼,一顆星或半顆星評分代碼

代碼結構

1. 引入JS

<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/startScore.js"></script>

2. HTML代碼

<div class="content">
    <p class="title">半顆星評分</p>
    <div id="startone"  class="block clearfix" >
          <div class="star_score"></div>
          <p style="float:left;">您的評分:<span class="fenshu"></span> 分</p>
          <div class="attitude"></div>
    </div>
    <p class="title">1顆星評分</p>
    <div id="starttwo" class="block clearfix">
        <div  class="star_score"></div>
        <p style="float:left;">您的評分:<span class="fenshu"></span> 分</p>
    </div>
    <script>
     scoreFun($("#startone"))
     scoreFun($("#starttwo"),{
           fen_d:22,//每一個a的寬度
           ScoreGrade:5//a的個數 10或者
         })
    </script>
    <p class="title">分數展示</p>
    <ul class="show_number clearfix">
       <li>
        <div class="atar_Show">
          <p tip="2.5"></p>
        </div>
        <span></span>
       </li>
       <li>
        <div class="atar_Show">
          <p tip="3.5"></p>
        </div>
        <span></span>
       </li>
       <li>
        <div class="atar_Show">
          <p tip="5"></p>
        </div>
        <span></span>
       </li>
    </ul>
    <script>
    //顯示分數
      $(".show_number li p").each(function(index, element) {
        var num=$(this).attr("tip");
        var www=num*2*16;//
        $(this).css("width",www);
        $(this).parent(".atar_Show").siblings("span").text(num+"分");
    });
    </script>
  </div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 滑動 滑塊 滑動門 觸屏滑動 滑動插件 滑塊插件 滑動星星打分 其他 滑動手風琴 頭像截圖
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子