我希望用户将鼠标悬停在一个链接上,该链接有一个名为图片的类和要动画的跨度(增加填充顶部),这是我到目前为止所做的代码,但是当用户将鼠标悬停在它上面时,它会对它们进行动画处理,我只希望它对用户悬停在其上的动画进行动画处理。
$('.picture').each(function(){
$('.picture').hover(function(){
$('.picture span').animate({
'padding-top' : '20px'
},'fast');
});
$('.picture').mouseout(function(){
$('.picture span').animate({
'padding-top' : '10px'
},'fast');
});
});
Run Code Online (Sandbox Code Playgroud)
任何帮助将不胜感激,我认为它在每个功能的某个地方出了问题,但我不确定。可以在这里找到它的链接: http: //bathroomsyork.co.uk/
我的代码(全窗启动).
我的JS代码:
$(document).ready(function () {
$("#play_buttton").hover(
function () {
$('#play_button').css({ "height": "240px", "width": "250px" });
},
function () {
$('#play_button').css({ "height": "225px", "width": "220px" });
}
);
});
Run Code Online (Sandbox Code Playgroud)
我认为这段代码必须创造问题.
问题:当我将鼠标悬停在图像上时(#play_button),没有任何反应,它的高度和宽度不会改变.任何人都可以告诉我如何解决这个问题.
谢谢.
有没有办法可以使用jquery访问当前鼠标悬停在其上的元素?
我知道我可以通过将mouseover事件附加到元素来访问元素,但是当我没有向元素应用任何事件并且想要访问由鼠标从文档中的任何位置悬停的特定元素时怎么样? ?
我创建了一个包含图像的div,每个图像都在自己的div中,链接到我网页顶部的不同社交媒体网站.我使用jquery更改img src打开hover然后返回到原始图像.图像均为24x24px,容器高24px.Firefox仍然存在兼容性问题,但我现在并不那么担心它们.我遇到的问题是,当我将鼠标移到图像上时,所有内容都会发生变化并完全变回,但图像会自动降低一两个像素,并在底部切断.当我悬停时,外面的两个图像不会移动,它只是中间的图像.
该网站可以在这里找到:
我正在尝试使用JavaScript和jQuery创建一个移动面板.
我做了这个工作演示,JS部分看起来像这样:
$("nav.nav").hover(function(){
$("nav.nav").animate({left:'-5px'},100,"swing");
},
function(){
$("nav.nav").animate({left:'-170px'},100,"swing");
});
Run Code Online (Sandbox Code Playgroud)
正如你所看到的,它正在工作,但是当我离开面板时我想添加延迟,因为有一段时间,我错误地将面板留下1个像素,这很烦人.
我试着setTimeout("javascript function", milliseconds);像这样使用:
$("nav.nav").hover(function(){
$("nav.nav").animate({left:'-5px'},100,"swing");
}, setTimeout(function(){
$("nav.nav").animate({left:'-170px'},100,"swing");
},10));
Run Code Online (Sandbox Code Playgroud)
(超时中的回调函数)但它不起作用,我不知道为什么.
哪个更适合网站速度,CSS:悬停或jQuery悬停?或者他们差不多?