0

我需要两个变量(mySwipe1,mySwipe2),但我不想重复 .photoSwipe({...}) 中的参数

<script>
$(document).ready(function(){

    var mySwipe1 = $("#Div1 a").photoSwipe({ 
        captionAndToolbarAutoHideDelay: 0, 
        captionAndToolbarFlipPosition: true,
        doubleTapZoomLevel: 2,
        imageScaleMethod:  "fitNoUpscale",
        loop: false,
        preventSlideshow: true
    });         
    var mySwipe2 = $("#Div2 a").photoSwipe({ 
        captionAndToolbarAutoHideDelay: 0, 
        captionAndToolbarFlipPosition: true,
        doubleTapZoomLevel: 2,
        imageScaleMethod:  "fitNoUpscale",
        loop: false,
        preventSlideshow: true
    });

});
</script>

更多信息: 我是一名设计师。这是我网站的作品集画廊的一部分。如果我将 div 元素汇总在一个变量var mySwipe1 = $("#Div1 a, #Div2 a").photoSwipe({...中,则两个预期的画廊将合而为一。我需要多个画廊。

感谢您的帮助。

4

3 回答 3

1

你是这个意思?

var opts = { 
        captionAndToolbarAutoHideDelay: 0, 
        captionAndToolbarFlipPosition: true,
        doubleTapZoomLevel: 2,
        imageScaleMethod:  "fitNoUpscale",
        loop: false,
        preventSlideshow: true
    };
var mySwipe1 = $("#Div1 a").photoSwipe(opts); 
var mySwipe2 = $("#Div2 a").photoSwipe(opts);

如果您想保留第一次滑动的某些属性并在第二次覆盖某些属性,您可以使用

var firstSwipe = {
 captionAndToolbarAutoHideDelay: 0, 
            captionAndToolbarFlipPosition: true,
            doubleTapZoomLevel: 2,
            imageScaleMethod:  "fitNoUpscale",
            loop: false,
            preventSlideshow: true
},
secondSwipe = $.extend(firstSwipe, {
  preventSlideshow: false // some override
});
var mySwipe1 = $("#Div1 a").photoSwipe(firstSwipe); 
var mySwipe2 = $("#Div2 a").photoSwipe(secondSwipe);
于 2013-05-28T16:04:14.170 回答
0

您可以使用传递给两个初始化的单个配置对象:

$(document).ready(function(){

    var config = { 
        captionAndToolbarAutoHideDelay: 0, 
        captionAndToolbarFlipPosition: true,
        doubleTapZoomLevel: 2,
        imageScaleMethod:  "fitNoUpscale",
        loop: false,
        preventSlideshow: true
    };

    var mySwipe1 = $("#Div1 a").photoSwipe(config);         
    var mySwipe2 = $("#Div2 a").photoSwipe(config);

});

photoSwipes或者,如果插件支持,您可以同时初始化两者:

$(document).ready(function(){
    var mySwipe1 = $("#Div1 a, #Div2 a").photoSwipe({ 
        captionAndToolbarAutoHideDelay: 0, 
        captionAndToolbarFlipPosition: true,
        doubleTapZoomLevel: 2,
        imageScaleMethod:  "fitNoUpscale",
        loop: false,
        preventSlideshow: true
    });
});
于 2013-05-28T16:04:22.407 回答
0

您可以使用参数构造一个对象:

<script>
$(document).ready(function(){
    var mySettings = { 
        captionAndToolbarAutoHideDelay: 0, 
        captionAndToolbarFlipPosition: true,
        doubleTapZoomLevel: 2,
        imageScaleMethod:  "fitNoUpscale",
        loop: false,
        preventSlideshow: true
    };

    var mySwipe1 = $("#Div1 a").photoSwipe(mySettings);         
    var mySwipe2 = $("#Div2 a").photoSwipe(mySettings);

});
</script>
于 2013-05-28T16:03:35.283 回答