簡單的jQuery動畫不工作

任何人都可以幫助我解決這個問題，我錯過了什麼？簡單的jQuery動畫不工作

<script type="text/javascript"> 

    $('#loginButton').click(function() { 
    $('#toplogin').animate({ 
     height: '0px' 
    }); 
    }); 
</script>

的onClick甚至不執行！

我想onClick事件工作，對DIV是在這裏：

<div id="loginButton"><a href="#" title="login">Login &raquo;</a></div>

我希望動畫影響的div是在這裏：

div id="toplogin"> <!-- more stuff --> </div>

來源

2011-05-30 user775736

你並不需要，經過分號物體內部的高度線。否則看起來沒問題，你確定'.click（）'被解僱嗎？你肯定有這些ID的元素？有CSS導致問題？ – Orbling 2011-05-30 05:00:22

試試這個：

$('#loginButton').click(function() { 
    $('#toplogin').animate({ 
     height: 0 
    }, 
    function() { 
     $(this).css('display', 'none'); 
    }); 
});

來源

2011-05-30 05:19:29 thecodeparadox

@ user775736我測試過，代碼不工作。這可能工作。我也使用css將'height：0px'設置爲'div'，並且它不隱藏內容。爲什麼這我不知道。如果有人有任何建議，請分享。 – thecodeparadox 2011-05-30 05:22:35

height: '0px'後刪除分號，使您的JavaScript有效。

<script type="text/javascript"> 
    $('#loginButton').click(function() { 
    $('#toplogin').animate({ height:'0px' }); 
    }); 
</script>

但是，除非你有#toploginoverflow:hidden集的元素將仍然是可見的，即使它的高度0px。更簡單的方法是使用slideUp()。

<script type="text/javascript"> 
    $('#loginButton').click(function(){ $('#toplogin').slideUp(); }); 
</script>

來源

2011-05-30 04:57:07 Marcel

nope，沒有工作 – user775736 2011-05-30 05:02:07

這應該工作......它不工作，只有從css你隱藏的元素。 – 2011-05-30 05:13:14

@ user775736：添加額外的信息來回答它似乎不起作用的原因。 – Marcel 2011-05-30 05:56:53

你應該換在下面的結構，使之有效，jQuery代碼代碼：

$(document).ready(function(){ 
    your code; 
})

來源

2011-05-30 06:19:55

簡單的jQuery動畫不工作

回答

相關問題