為什么打開瀏覽器時jQuery無法正常工作/無法顯示？

Question

 <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"> $(document).ready(function() { $('#top_message').slideDown(300); }); </script> <meta charset="utf-8"> <title>jQuery</title> <style type="text/css"> #top_message { height: 50px; width: 75%; background-color: orange; } </style> </head> <body> <div id="top_message"> We can see you're not logged in. Do you want to <a href="#">sign up</a>? </div> </body> </html>

我在瀏覽器上運行代碼，但它沒有像預期的那樣向下滑動，我做錯了什么？ 謝謝。

Answer 1

因為您正在嘗試使用相同的腳本來加載jQuery和您自己的代碼。

而是使用兩個不同的腳本。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $('#top_message').slideDown(300);
  });
</script>

Answer 2

可能是因為您期望slideDown（）將內容沿頁面向下滑動（即更改top位置）。

slideDown()將height動畫slideDown() 100％

.slideDown（）方法可對匹配元素的高度進行動畫處理。 這會使頁面的下部向下滑動，為顯示的項目騰出空間。

持續時間以毫秒為單位； 較高的值表示較慢的動畫，而不是較快的動畫。 可以提供字符串“ fast”和“ slow”以分別指示200毫秒和600毫秒的持續時間。 如果提供了任何其他字符串，或者省略了duration參數，則使用默認的持續時間400毫秒。

由於您的元素已經可見，因此從100％更改為100％無效 。

將您的代碼更改為：

$('#top_message').hide().slideDown(300);

然后您會看到它的作用： https : //jsfiddle.net/cqwbtdb1/

為什么打開瀏覽器時jQuery無法正常工作/無法顯示？

問題描述

2 個解決方案

解決方案1
1 已采納

解決方案2
0 2015-12-05 15:50:34

為什么打開瀏覽器時jQuery無法正常工作/無法顯示？

問題描述

2 個解決方案

解決方案1 1 已采納

解決方案2 0 2015-12-05 15:50:34

解決方案1
1 已采納

解決方案2
0 2015-12-05 15:50:34