这里是我使用的代码的小提琴:FIDDLE,由于重叠错误阻止a.trigger在IE中工作我需要将div.pop-up放在屏幕上直到a .trigger正在盘旋。
任何人都知道如何做到这一点
答案 0 :(得分:1)
这是一个古老的学校黑客攻击它。您只需将元素从屏幕左侧放置1000px,然后在动画制作之前将其恢复原状:
$(document).ready(function() {
//If Javascript is running, change css on product-description to display:block
//then hide the div, ready to animate
$("div.pop-up").css({'display':'block','opacity':'0'})
$("a.trigger").hover(
function () {
$(this).prev().css("left", "0px");
$(this).prev().stop().animate({
opacity: 1
}, 500);
},
function () {
// First answer had this line coming first.
// $(this).prev().css("left", "-1000px");
$(this).prev().stop().animate({
opacity: 0
}, 200);
// It should actually probably be here
// so the movement is still done invisibly
$(this).prev().css("left", "-1000px");
}
)
});
您还需要在CSS中向左添加定位。
/* HOVER STYLES */
div.pop-up {
/*display: none;*/
text-align: left;
position: absolute;
left: -1000px; // <--- Send me left
margin-top: -10px;
width: 120px;
padding: 0px 13px;
background: #eeeeee;
color: #000000;
border: 1px solid #1a1a1a;
font-size: 90%;
}
见我行动 - &gt; JSFiddle