Question

我正在尝试构建基于Zurb Foundation框架的响应式网页。一切正常，直到我尝试添加使用jQuery的nanoGallery。当我添加图库脚本时，Foundation脚本生成的顶级菜单变得无法点击，：hover工作正常，但如果点击它，则没有任何反应。可以免费访问http://emfoto.filipsvoboda.net/presentation.html的确切页面。

这就是我试图调用每个脚本的方式：

<script src="js/jquery.js"></script>
<script src="/js/foundation.min.js"></script>
    <script>
    jQuery(document).foundation();
</script>

<script src="third.party/transit/jquery.transit.min.js"></script>
<script src="third.party/hammer.js/hammer.min.js"></script>
<script src="third.party/imagesloaded/imagesloaded.pkgd.min.js"></script>
<script src="jquery.nanogallery.js"></script> 
<script>
    jQuery("#nanoGallery").nanoGallery({
    kind:'flickr',
    (..)
    thumbnailHoverEffect:[{'name':'borderLighter'}],
    thumbnailLabel:{display:false},
    });
</script>

我已经尝试更改这些脚本的顺序，但这似乎没有帮助。

编辑：它似乎在IE10中正常运行，但在基于Chrome的浏览器中，它仍无效。

EDIT2：在继续摆弄代码之后，很明显，该页面上画廊本身的存在会导致错误。脚本顺序似乎没有任何区别，只要没有显示库，基础工作正常，链接确实有效。

EDIT3：更新了代码，将其删除并更改了脚本的顺序。我在示例页面中添加了简单的“a”链接，但它也不起作用。

EDIT4：我搜索了event.preventDefault()，它出现在图库的* .js文件中。我已经联系了作者，如果我们得到任何解决方案，我会在这里发布。

感谢您的帮助。

Answer 1

我使用Developer Extensions（chrome）和Firebug（firefox）比较了chrome和firefox请求和响应，以获取Net面板中显示的信息。我不确定chrome找不到的文件是否是导致问题的原因，但是想指出这种差异。

<强>铬

firefox http://emfoto.filipsvoboda.net/third.party/hammer.js/hammer.min.js

Answer 2

暂时无论如何，您可以通过点击处理程序来解决此问题，该处理程序将读取网址并将网页带到该网址。

$(function () {
    $("a").click(function () {
        var url = $(this).attr("href");
        window.location.href = url;
    });
});

Answer 3

此问题已在nanoGALLERY v4.2.1中修复：

https://github.com/Kris-B/nanoGALLERY/releases/tag/4.2.1

运行jquery gallery使链接无法点击

3 个答案: