如何相对于窗口顶部定位弹出窗口？

Question

我创建了一个基本的灯箱，当点击缩略图时，会出现一个弹出窗口。如何使用jQuery检测顶部位置，因此当弹出div出现时，它总是例如从窗口顶部200px？

$('#thumbs img').click(function(){
  $('.popup').fadeIn(300);
  $('#dark-overlay').fadeIn(300);
});

$('#dark-overlay').click(function(){
  $(this).fadeOut(300);
  $('.popup').hide();
});

示例：http://jsfiddle.net/EXT4H/1/

Answer 1

这是工作的jsfiddle：http://jsfiddle.net/kcG9W/。你需要计算窗口的滚动偏移量，这会使顶部看起来像0px，然后加200，这样顶部看起来是200px。

$('#thumbs img').click(function(){
    $('.popup').fadeIn(300);
    $('#dark-overlay').fadeIn(300);
    var top = $(window).scrollTop() + 200 + 'px';
    $('.popup').css({top:top});
});