欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

如何制作幻燈片(代碼分享)

 更新時(shí)間:2017年01月06日 16:34:57   作者:鏡子-正衣冠-知得失  
本文主要分享了制作幻燈片的實(shí)例代碼,具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧

話不多數(shù),請(qǐng)看代碼:

一 輪播 定時(shí)

<style type="text/css">
  #dw_JS_huanDeng_2 {
    margin: 0 auto;
    width: 1100px;
    position: relative;
    z-index: 5;}
  #JS_HDmenu_2 {
    position: absolute;
    top: 300px;
    z-index: 4;
  }
  ol, ul {
    list-style: none;
  }
  #JS_HDmenu_2 li {
    float: left;
    width: 12px;
    height: 12px;
    margin: 0 5px;
    border-radius: 6px;
    cursor: pointer;
    background-color: #A79B9B;
  }
  #JS_HDmenu_2 li:hover {
    background-color: red;
  }
  #JS_huanDeng_2 {
    margin: 0px auto 0 auto;
    position: relative;
    height: 320px;
    overflow: hidden;}
  #JS_huanDeng_2 div, #JS_huanDeng_2 a {
    display: block;
    width: 100%;
    height: 100%;
  }

  #JS_huanDeng_2 div {
    position: absolute;
    z-index: 4;
  }
</style>
<script src="__PUBLIC__/H/js/jquery.min.js"></script>
<!-- //幻燈片-->
  <div class="JS_huanDeng_2_bg" >
    <div id="dw_JS_huanDeng_2" >
      <ul id="JS_HDmenu_2" >
      </ul>
    </div>
    <div id="JS_huanDeng_2" style="border:0px solid red;">
      <volist name="banner" id="va">
        <div> <a href="{$va.content}" style="background:url(__ROOT__/{$va.content}) center top no-repeat #fff;"></a></div>
      </volist>
    </div>
  </div>
<!--首頁(yè)幻燈片輪播 【2016-5-27 】 start-->
<script type="text/javascript">
  for(var i=0;i<$("#JS_huanDeng_2 div").length;i++){
    $('#JS_HDmenu_2').append("<li></li>");
  }
  //alert($('#JS_HDmenu_2').width());
  var ml=(1100-$('#JS_HDmenu_2').width())/2;
  //alert(ml);
  $('#JS_HDmenu_2').css('left',ml+'px');
  $('#JS_huanDeng_2 div').eq(0).show().siblings().hide();
  var i=0;
  var timeId = setInterval("autoChange()",3000);
  $('#JS_HDmenu_2 li').mouseover( function(){
    clearInterval(timeId);
    var I=$(this).index();
    $('#JS_huanDeng_2 div').eq(I).fadeIn().siblings().fadeOut();

  })
  $('#JS_HDmenu_2 li').mouseout(function(){
    timeId = setInterval("autoChange()",3000);
  });
  function autoChange(){
    i++;
    if(i>$('#JS_huanDeng_2 div').length){
      i=0;
    }
    $('#JS_huanDeng_2 div').eq(i).fadeIn().siblings().fadeOut();
  }
</script>
<!--首頁(yè)幻燈片輪播 【2016-5-27 】 end-->

以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,同時(shí)也希望多多支持腳本之家!

相關(guān)文章

最新評(píng)論