jQuery mouseenter和fadeTo问题
我正在做codeacademy.com jQuery课程,以便在我阅读jQuery In Action书籍之前获得jQuery的好品味,而且我已经完成了一部分而且代码不起作用,我不明白为什么.
我在这里创建了一个jsFiddle http://jsfiddle.net/weacY/
以下是codeacademy.com的说明:
大!接下来,让我们一起包含我们的function关键字和两个新动作:mouseenter()和fadeTo().
mouseenter()执行您可能期望的操作:当鼠标进入给定的HTML元素时,它会产生更改.例如,
$(document).ready(function(){$('div').mouseenter(function(){$('div').hide();});}); 一旦鼠标悬停在页面上,它就会隐藏在页面上的每一个.(我们将在下一课中找到如何影响其中一个.)现在,我们只有一个,所以这个设置没问题.
但是,我们将fadeTo()放在mouseenter()中,而不是hide().fadeTo()在其括号之间采用两个参数或输入,用逗号分隔:淡入淡出的速度和淡入淡出的不透明度(或透明度).例如,
fadeTo('fast',0.25); 会迅速将目标元素淡化到其原始不透明度的25%,使其非常浅色.
使用上面的例子,当你的鼠标进入'div'时,使你的'div'淡化为1(100%)不透明度.使动画速度"快".(确保以顺序速度为fadeTo()提供输入,然后是不透明度.)
将鼠标悬停在"div"上即可看到效果!
这是HTML:
<html>
<head>
<title>Button Magic</title>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
</head>
<body>
<div><br/><strong>Click Me!</strong></div>
<script>type="text/javascript" src="script.js"</script>
</body>
</html>?
这是CSS:
div {
height: 60px;
width: 100px;
border-radius: 5px;
background-color: #69D2E7;
text-align: center;
color: #FFFFFF;
font-family: Verdana, Arial, Sans-Serif;
opacity: 0.5;
}?
最后是jQuery:
$(document).ready(function() {
$("div").mouseenter(function() {
$("div").fadeTo("fast", 1);
});
});?
在此先感谢您的帮助.
