3

現在、サムネイルをクリックしたときに画像を表示するためにfancyboxバージョン2を使用していますが、水平方向には問題がないため、垂直方向に言えば、fancyboxをビューポートの中央に配置できないようです。

私はかなりの数のことを試しましたが、これは最新のものです：

CSS

.fancybox-wrap { 
    position: fixed !important;
    top: 50px !important;
}

jQuery

jQuery(document).ready(function() {
    $(".fancybox-wrap").css("position", "absolute");

    // fancybox initialisation etc

});


$(window).scroll(function() {
    $('.fancybox-wrap').css('top', $(this).scrollTop() + "50px");
});

誰かアイデアはありますか？

4

3 に答える 3

4

あなたがする必要があるのは、ウェブサイトのcssに追加することだけです

html, body {height: 100%;}

また、fancybox は画像をページ中央ではなく画面中央に配置します。

于 2017-08-24T05:49:34.677 に答える
3 
$(window).bind('resize', function() {
    var top = ($(window).height() / 2) - ($(".fancybox-wrap").outerHeight() / 2);
    var left = ($(window).width() / 2) - ($(".fancybox-wrap").outerWidth() / 2);
    $(".fancybox-wrap").css({ top: top, left: left});
}).trigger('resize');

http://jsfiddle.net/aGhxK/23/

于 2013-04-23T03:14:08.093 に答える
0

これは、動的に設定leftおよびtop使用しposition: absoluteます。

http://jsfiddle.net/aGhxK/1/

于 2012-08-22T15:16:14.110 に答える