用户界面-定位jquery ui工具覆盖的问题

Question

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

Answer 1

这比看起来要复杂得多…事实上，你的只是需要将position从fixed更改为absolute，但由于它是由覆盖插件完成的，你不能只是在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');