Question

我在做什么工作我似乎无法动画。我认为这与我试图调用jquery动画

的原因有关

<script>
$('#grid').click(function() {
   console.log("dsdsd");
   $('#book').animate({
       opacity: 0.25,
       left: '+=50',
       height: 'toggle'
     }, 5000, function() {
   });
});
</script>

</head><body>

  <div class="portfolio">
    <ul id="grid">
       <li><a href="#" id="book" ><img src="1.jpg"></a></li>
       <li><a href="#"><img src="2.jpg"></a></li>
       <li><a href="#"><img src="3.jpg"></a></li>
       <li><a href="#"><img src="4.jpg"></a></li>

   </ul></div>

Answer 1

这是一个慢动画，但它有效（http://jsfiddle.net/sXyBa/）

jQuery(document).ready(function($) {
    $('#grid').click(function() {
     console.log("dsdsd");
     $('#book').animate({
       opacity: 0.25,
       left: '+=50',
       height: 'toggle'
       }, 5000, function() {
    });
  }); 
})

Answer 2

你错过了：

jQuery(function($){

   // your code here

});

在开始与元素和事件交互之前，这将确保读取DOM。

P.S：以上是$(document).ready(function(){

的更好的简写

http://api.jquery.com/ready/

更多：您有一个不需要的回调animate()函数，它应该如下所示：

$('#book').animate({
   opacity: 0.25,
   left: '+=50',
   height: 'toggle'
}, 5000);

除非你有一些疯狂的东西，一旦动画结束就会被触发

jquery动画不想开火

2 个答案: