我正在使用灯箱来显示带有照片的评论。问题是,当我向下滚动以查看灯箱,然后滚动回到顶部时,即使在指定顶部后,顶部边距也会发生变化。
我指定顶部和左侧的 jQuery 代码是:
jQuery.fn.center = function() {
this.css("position","fixed");
var top = "20px";
left = ( $(window).width() - this.width() ) / 2+$(window).scrollLeft()+"px";
this.animate({top: top, left: left});
return this;
}
$('#tp-lightboxactitem').center();
这是灯箱 div 的 HTML:
<div class="dark-lightbox lightboxitem tp-lightboxactitem-loaded" id="tp-lightboxactitem" style="display: block; top: 20px; left: 314.5px; position: fixed; margin-top: 30px;">
<div>
<center>
<img src="uploads/_DSC9322_watcopy_bor_5_$1$uh2.fw5.$uFln.yw5QjSgVKjmhD8.jpg?id=3&pic=113" class="tp-mainimage" id="plzxc">
</center>
</div>
<div class="dark-lightbox infofield">
<div class="dark-lightbox title"></div>
<div class="dark-lightbox pageofformat">( 1 / 5 )</div>
<div class="dark-lightbox description" id="dark-lightbox description">
滚动前的显示方式
![滚动前的显示方式][1]
向下滚动然后再次向上滚动后的显示方式
![向下滚动然后再次向上滚动后的显示方式][2]
最佳答案
通过做一些小的改变来解决这个问题
代码如下,希望对有需要的人有所帮助
cssAnimate({'left':($(window).width()/2 - thisw/2)+'px', 'top':'20px' },{duration:300,queue:false});
关于javascript - 一次向下滚动并再次向上滚动后灯箱顶部边距变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9203328/