javascript 在 MouseOver 和 MouseOut 上调用 jQuery 函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5289243/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Calling a jQuery function on MouseOver and MouseOut
提问by Darin Dimitrov
I have the following code:
我有以下代码：
<script src="http://code.jquery.com/jquery-1.5.js" type="text/javascript">
$(function() {
$('.webPanel').mouseover(function(){
$('.webPanel').animate({'width': '350px'}, 100);
});
});
</script>
Which doesn't work. As you could probably tell, it's supposed to expand the .webPanel div to 350px on mouseover, but nothing happens.
哪个不起作用。正如您可能会说的，它应该在鼠标悬停时将 .webPanel div 扩展到 350px，但没有任何反应。
How can I get this thing to work? I don't understand why it isn't working!
我怎样才能让这件事发挥作用？我不明白为什么它不起作用！
Thank you
谢谢
回答by Darin Dimitrov
You need a separate script inclusion for jquery:
您需要为 jquery 添加一个单独的脚本：
<script src="http://code.jquery.com/jquery-1.5.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('.webPanel').mouseover(function(){
$('.webPanel').animate({'width': '350px'}, 100);
});
});
</script>
回答by Zakaria
回答by Santosh Linkha
<script src="http://code.jquery.com/jquery-1.5.js" type="text/javascript"></script>
<script>
//you script
</script>
And how about hover function
悬停功能怎么样
<script src="http://code.jquery.com/jquery-1.5.js" type="text/javascript"></script>
<script>
$(function() {
$('.webPanel').hover(
function(){
$('.webPanel').animate({'width': '350px'}, 100);
},
function (){
$('.webPanel').animate({'width': '500px'}, 100);
}
});
});
</script>
回答by bensiu
your function need to be in separate script tag:
您的函数需要在单独的脚本标签中：
<script type="text/javascript"> // this missing
$(function() {
$('.webPanel').mouseover(function(){
$('.webPanel').animate({'width': '350px'}, 100);
});
});
</script> // this missing
