jQuery：鼠標事件不起作用

-3

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2"></script> 

    <script> 
     $(document).ready(function() { 
      $('.mydiv').mouseenter(function() { 
       $('.mydiv').fadeTo('fast', 1); 
      }); 
      $('.mydiv').mouseleave(function() { 
       $('.mydiv').fadeTo('fast', 0.5); 
      }); 
     }); 
    </script> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"> 
</head> 


<body> 
    <div class="mydiv"><br><strong>Click Me!</strong></div> 

</body> 
</html>

上面的代碼是一個測試HTML文件，其中的jQuery不工作，有沒有人可以幫我找到解決我的問題。我找不到錯誤（我使用Google Chrome 34.0.1847.137米）。jQuery：鼠標事件不起作用

如果有人需要，這是CSS文件：

div { 
    height: 60px; 
    width: 100px; 
    border-radius: 5px; 
    background-color: #69D2E7; 
    text-align: center; 
    color: #FFFFFF; 
    font-family: Verdana; 
    opacity: 0.5; 
}

來源

2014-05-15 Funest

使用舊的jQuery 1.6.4的任何理由？ –

打開控制檯並告訴我們錯誤信息... – HaukurHaf

Works fine here http://jsfiddle.net/j08691/z8YBm/1 – j08691

你使用jQuery的過時的版本，更改爲新的版本，它會在Chrome瀏覽器。

jsBin demo

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

還只是一個小編輯到您的代碼：

$(function() { // DOM ready shorthand 
    $('.mydiv').hover(function(e) { 
     $(this).stop().fadeTo(300, e.type=="mouseenter"?1:0.5); 
    }); 
});

沒有的jQuery，CSS3中

jsBin demo

.mydiv{ 
    /* your styles here */ 
    opacity: 0.5; 
    transition: opacity 0.3s; 
} 
.mydiv:hover{ 
    opacity: 1; 
}

來源

2014-05-15 20:48:46

如果他看到「$未定義」，請參閱最後一條評論。另外，其中一個發佈的JSFiddle鏈接（以及我運行的本地測試）使用舊的jQuery版本，並且仍然有效。 –

它不能在我的電腦上工作... – Funest

@ user3642345我已經編輯了一些修復我的答案。你有沒有試過我的鏈接例子？哪一個不工作？ –

jQuery：鼠標事件不起作用

回答

相關問題