如何让用户在显示photoswipe画廊时点击链接？

我正在使用jQuery的PhotoSwipe插件。如何让用户在显示photoswipe画廊时点击链接？

我的网站使用一个固定的菜单，当用户向下滚动。

随着z-index的我没能做出photoswipe画廊重叠我的菜单。所以我调整了默认的photoswipe窗格大小，以便为菜单腾出空间。我也喜欢这种外观。

现在，当我打开一张照片，但是不是导向与PhotoSwipe的其他页面，PhotoSwipe的一些回调呈现给用户重定向到他来自哪里。

如果我使用破坏回拨photoswip，并把警报在里面，这延迟的重定向（返回到用户来自的页面）。

我怎么能允许用户关闭photoswipe画廊，而不被重定向？

编辑： 这是我如何初始化photoswipe画廊。

function showSoftwareGallery(sections, index){ 
    var pswpElement = document.querySelectorAll('.pswp')[0]; 

    var items = new Array(sections.length); 
    for(var i=0; i<sections.length; i++){ 
     items[i] = { 
      src: sections[i].image, 
      w: 1920, 
      h: 1080, 
     }; 
    } 

// define options (if needed) 
    var options = { 
     // optionName: 'option value' 
     // for example: 
     index: index, // start at first slide 
     escKey: true, 
     arrowKeys: true, 
     shareEl: false, 
     closeEl:true, 
     captionEl: true, 
     fullscreenEl: true, 
     zoomEl: true, 
    }; 

// Initializes and opens PhotoSwipe 
    var headerHeight = $('nav').first().height(); 
    var height = $(window).height() - headerHeight; 
    $('.pswp').first().css('height', height + 'px'); 
    $('.pswp').first().css('top', headerHeight + 'px'); 
    var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options); 


    gallery.listen('destroy', function() { alert('destroy')}); 


    gallery.init(); 
}

编辑2 你在这里看到我的photoswipe显示的屏幕截图。它显示我的主菜单仍然可见，用户可以点击它。

来源

2017-04-23 Jakob Alexander Eichler

你填充项目变量？发布代码初始化并调用photoswipe。 –

我编辑了这个问题。谢谢。 –

那么这些都是我用photoswipe发现的问题：不正确的项目变量，javascript错误（在这种情况下，图像在该选项卡中打开）。你可能还有的问题是菜单被点击并将用户带到某个地方？老实说，我不知道你的意思是什么：'现在当我打开一张照片，但是用PhotoSwipe导航到另一个页面时，PhotoSwipe的一些回调似乎将用户重定向到他来自哪里。“你怎么能使用photoswipe导航到其他页面？重定向用户在哪里？用户来自哪里？ –

src/js/history.js文件包含以下代码：

 _listen('destroy', function() { 
      if(!_hashReseted) { 
       returnToOriginal(); 
      } 
     });

您没有提供可重复的代码，所以这是不是100％，但应该是有帮助的。我的代码改成这样：

 _listen('destroy', function() { 
      if(!_hashReseted && !myApp.shouldClosePhotoswipe) { 
       returnToOriginal(); 
      } 
     });

在您的应用程序添加以下代码：

var myApp = { 
    // mix in with your javascript code 
    shouldClosePhotoswipe: false 
}

，并点击菜单时去的地方只需添加这行：

myApp.shouldClosePhotoswipe = true;

然后你需要重建dist/photoswipe.js文件。
您也可以直接编辑0文件。

来源

2017-04-26 08:29:41

如何让用户在显示photoswipe画廊时点击链接？

回答

相关问题