[英]jquery mouseenter and fadeTo
我希望div會在鼠標進入時淡化為不透明度1，在離開時淡化為0.5。 這是我的代碼：
<script>
$(document).ready(function(){
$("#header").mouseenter(function(){
$("#header").fadeTo('fast', 1);
});
$("#header").mouseleave(function(){
$("#header").fadeTo('fast', 0.5);
});
}
</script>
HTML：
<body>
<div id="header">
<h1>Hello!</h1>
<p>blah blah...</p>
</div>
</body>
我的體內有一個div，其中包含一個h1和一個p。 當我將鼠標移到鼠標上方時，什么也沒有發生。 有什么事嗎
您的縮進錯誤會隱藏語法錯誤：
$(document).ready(function(){
$("#header").mouseenter(function(){
$("#header").fadeTo('fast', 1);
});
$("#header").mouseleave(function(){
$("#header").fadeTo('fast', 0.5);
});
}); // <= missing parenthesis
除此之外， 它還可以工作 。 請注意，並不是所有顏色組合的0.5都不透明。
CSS怎么樣？
#header {
opacity: .5;
transition: opacity .3s ease-in-out;
}
#header:hover {
opacity: 1;
}
只需確保添加所有CSS供應商前綴即可。 這比使用jQuery IMO更好。 如果瀏覽器不支持transition或opacity那沒什么大不了的，這就是“優雅降級”的全部含義。
jQuery mouseenter和mouseleave淡入防止延遲重復
[英]jQuery mouseenter and mouseleave fadeTo prevent delayed repeat
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.