Question

我正在使用jquery ui工具叠加插件，它几乎100％正常工作，但当我点击打开图像并向下滚动图像时。我很快发现这是因为脚本将定位设置为固定。但是，当我使用文档http://jquerytools.org/demos/overlay/custom-effect.html上提供的配置更改定位时，我仍然得到相同的结果。该网站是marccasavant.com

Answer 1

这比看起来更复杂......确实，只是需要将position从fixed更改为absolute，但因为它是由overlay插件完成，你不能只在css中设置它，你需要在运行中进行。

我想出的解决方案是声明自定义效果：

$.tools.overlay.addEffect("change", function(css, done) {
css.position = 'absolute';
overlay = this.getOverlay();
   overlay.css(css).show();
   overlay.animate({
      top: '+=55',  opacity: 1,  width: '+=20'
      }, 400, done
   );
   done.call();
}, function(done) {
   this.getOverlay().animate({
      top:'-=55', opacity:0, width:'-=20'
   }, 300, function() {
      $(this).hide();
      done.call();
   });

}）;

谁只是更改css position属性（并做一些动画，你可以明显改变），并做默认的东西。然后在初始化叠加层时添加它：

$(document).ready(function() {
   $("img[rel]").overlay({effect: 'absolute'});
});

我使用了本教程：http://jquerytools.org/demos/overlay/custom-effect.html并删除了自定义放置效果，并添加了定位更改。

Answer 2

我使用开发人员工具将位置更改为“绝对”，并且按预期工作。验证配置是否应用绝对位置，否则使用jQuery修改css：

$('.simple_overlay').css('position', 'absolute');

定位jquery ui工具叠加的问题

2 个答案: