幻灯片和滑动与动画easing

我需要一个光滑的幻灯片效果，我似乎无法理解我做错了什么。我曾尝试以下幻灯片和滑动与动画easing

$(document).ready(function(){ 
    $('.drop2').click(function(){ 
     var $next = $(this).parent().next('li.drop_down2'); 
     if($next.is(':visible')) { 
      $next.animate( {'display':'none'}, 'slow', 'easeOutBounce'); 
     } else { 
     $next.animate( {'display':'block'}, 'slow', 'easeOutBounce'); 
     } 
    }); 
    }); 

    $(document).ready(function(){ 
    $('.drop2').click(function(){ 
     var $next = $(this).parent().next('li.drop_down2'); 
     if($next.is(':visible')) { 
      $next.slideUp({ 
      duration: 1000, 
      easing: easeInSine, 
      complete: callback}); 
     } else { 
      $next.slideDown(); 
     } 
    }); 
    });

有什么我做错了，使这个流畅的效果发生

来源

2010-07-13 Trace

请使用代码标签，所以我们了解你在发布什么内容。同时告诉我们您正在测试的浏览器。 IE浏览器在JavaScript上显得很笨。 – Iznogood 2010-07-13 03:11:00

问题是它不光滑，或者根本不起作用？ – 2010-07-13 03:23:05

@Iznogood：我的问题是马特。对不起，不清楚。我同意他的代码很难阅读。我的抱怨是他没有描述任何症状。 – 2010-07-13 03:35:02

这应该让你开始，马特：

<div class="trigger"><a href="#" onclick="return false">Expand one.</a></div> 
<div class="expander">Item one is now shown.</div> 

<div class="trigger"><a href="#" onclick="return false">Expand two.</a></div> 
<div class="expander">Item two is now shown.</div> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script> 
<script> 
jQuery(document).ready(function() { 
    jQuery('.expander').hide(); 
    jQuery('.trigger').click(function() { 
     jQuery(this).next('.expander').slideToggle(); 
    }); 
}); 
</script>

来源

2010-07-13 03:40:39

幻灯片和滑动与动画easing

回答

相关问题