如何自动启动nanoGallery？

Question

我有一个使用nanogallery js plugin显示的图片库

当页面加载时，我需要自动启动它。

我的代码

<script>

    function myThumbnailDisplayEffect($elt, item, eltNumber) {
        $elt.css({'transform-origin': 'top right', 'rotate': '10deg', 'top':'-30px'});
        $elt.delay(eltNumber*30).transition({ 'rotate': '0deg', 'opacity':'1', top:'0px'},700);
        $elt.find('.nanoGalleryThumbnailContainer').click();

    }



    function loadGallery(){
        jQuery("#gallery").nanoGallery({thumbnailLabel:{display:false},
            colorSchemeViewer:'light',
            viewer:{display:false},
            thumbnailHoverEffect:'imageOpacity50',
            thumbnailWidth: 200,
            thumbnailHeight: 133,
            lazyBuild:'loadData',
            thumbnailLazyLoad:true,
            fnThumbnailDisplayEffect:myThumbnailDisplayEffect

        });
    }

    $(document).ready(loadGallery());
</script>

怎么做……？提前感谢您的帮助！

Answer 1

您可以在第一个元素上模拟单击事件。您需要将ID、Class或data属性添加到包含第一个图像的div中，然后使用jquery可以执行以下操作：

var firstElement = $('.nanoGalleryContainer').children()[0];
$(firstElement).trigger('mouseenter').trigger('click'); 

Answer 2

您可以通过URL参数使用深度链接来实现这一点。

例如：http://nanogallery.brisbois.fr/nanogallery_demo3.html#nanogallery/nanoGalleryExample/5870136791457517345/5871255268929586546

要启用此功能，您必须将插件参数locationHash设置为true。

更多示例：http://nanogallery.brisbois.fr/nanogallery_demo3.html