幻燈片菜單轉換

我在菜單中有一張左側幻燈片。當我加載頁面時，它會自動進行動畫和「滑入」。我的轉換速度在CSS中設置。問題在於通話功能（見下文）的轉換非常不順暢。如果我在.click之後添加速度（300），則完全不起作用。幻燈片菜單轉換

的腳本是：

<script> 
    $(document).ready(function() { 
     $('#showLeft').click(); 
     });</script>

CSS過渡：

.cbp-spmenu { 
-webkit-transition: all 0.3s ease; 
-moz-transition: all 0.3s ease; 
transition: all 0.3s ease;

}

如果任何人有關於如何使幻燈片過渡平滑的任何意見或建議。我會非常感激。

的Javascript：

//slidemenu.js 
var menuLeft = document.getElementById('cbp-spmenu-s1'), 
      showLeft = document.getElementById('showLeft'), 
      body = document.body; 

     showLeft.onclick = function() { 
      classie.toggle(this, 'active'); 
      classie.toggle(menuLeft, 'cbp-spmenu-open'); 
      disableOther('showLeft'); 
     }; 
     function disableOther(button) { 
      if(button !== 'showLeft') { 
       classie.toggle(showLeft, 'disabled'); 
      } 
     }

HTML

<body class="cbp-spmenu-push"> 

<!-- Side Menu --> 

<nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1"> 
    <button id="showLeft" class="menuOpen"><i class="icon-reorder icon-small"></i></button> 
    <div class="side-panel-top"><a href="index.html" id="logo"><img src="images/backgrounds/logo.png"></a></div> 
    <ul class="sidemenu"> 
     <li><a href="#">Twitter<i class="icon-chevron-right icon-small"></i></a> 
      <ul class="sidesub"> 
       <li><a href="#">Twitter</a></li> 
       <li><a href="#">Read</a></li> 
       <li><a href="#">Twitter</a></li> 
      </ul> 
     </li> 
     <li><a href="#">Github<i class="icon-chevron-right icon-small"></i></a></li> 
     <li><a href="#">Facebook<i class="icon-chevron-right icon-small"></i></a></li> 
     <li><a href="#">Github<i class="icon-chevron-right icon-small"></i></a></li> 
     <li><a href="#">Facebook<i class="icon-chevron-right icon-small"></i></a></li> 
    </ul> 
</nav>

來源

2013-06-23 Ryan Wegner

試試這個裏面$(document).ready(function()

$("#id want to slide").animate({left:'-200px'});

或

$("#id u want to slide").css({left:'-200px'});

來源

2013-06-23 08:39:59 Hulk1991

感謝您的回答。雖然不起作用。 –

幻燈片菜單轉換

回答

相關問題