Javascript 为什么不是';t.hover函数正在工作,如何使.hover函数忽略角半径以外的区域?
我试图让圆圈对我的jquery做出反应。悬停。以下是我的js:Javascript 为什么不是';t.hover函数正在工作,如何使.hover函数忽略角半径以外的区域?,javascript,jquery,css,jquery-hover,Javascript,Jquery,Css,Jquery Hover,我试图让圆圈对我的jquery做出反应。悬停。以下是我的js: jQuery.fn.center = function () { this.css("position","absolute"); this.css("top", Math.max(0, (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop()) + "px"
jQuery.fn.center = function () {
this.css("position","absolute");
this.css("top", Math.max(0, (($(window).height() - this.outerHeight()) / 2) +
$(window).scrollTop()) + "px");
this.css("left", Math.max(0, (($(window).width() - this.outerWidth()) / 2) +
$(window).scrollLeft()) + "px");
return this;
};
$(document).ready(function()
{
$('#logo').center();
j=8;
size=200;
$.each($(".circle"), function() {
$(this).css('z-index', j);
$(this).css({
height: size+"px",
width: size+"px",
borderRadius: size+"px",
});
size = size+50;
$(this).center();
j--;
});
});
$(".circle").hover(
function() {
$(this).animate({
height: '+=25px',
width: '+=25px',
top: '-=12.5px',
left: '-=12.5px'
}, 'fast'
);
},
function() {
$(this).animate({
height: '-=25px',
width: '-=25px',
top: '+=12.5px',
left: '+=12.5px'
}, 'fast'
);
}
);
以下是我的身体HTML:
<div id='logo'><img src='_Source/Logo.png' alt='RB'/></div>
<div id='a1' class='circle'></div><div id='g1' class='circle'></div>
<div id='a2' class='circle'></div><div id='g2' class='circle'></div>
<div id='a3' class='circle'></div><div id='g3' class='circle'></div>
<div id='a4' class='circle'></div><div id='g4' class='circle'></div>
这在JSFIDLE上有效
但是,在我的网站上,它不起作用
如果我不是秃头,我会把头发扯下来
谢谢。绑定调用
.hover()
位于.ready()
绑定的范围之外,并且位于
中。最终的效果是,您试图在加载DOM之前绑定.hover
回调。解决这个问题的最简单方法是将它移到.ready()绑定函数的作用域中。JSFIDLE和您的站点有不同的代码。我只是简单地复制粘贴了JSFIDLE中的圆圈悬停部分,在站点控制台中执行,它在一个旁注中工作。不确定这是否是有意的,但在你的小提琴中,当你在divs/图像上忙碌地移动鼠标大约20秒左右时,圆圈最终会偏移。只是想知道数学是否有点不对劲。@Esailija你说的是HTML还是JS?@wdbphoto,特别是悬停绑定JS,没有别的。Copypasta从$(“.circle”).hover(
..@Esailija)开始。我只是复制并粘贴了代码,只是为了确保没有发生任何事情。哎呀,我现在觉得自己像个白痴。谢谢。你知道如何让悬停忽略边界半径以外的区域吗?