0

我有一个我真的无法解决的问题，希望你们能帮助我，因为我在 css/js 方面相对较新。我正在尝试使用整洁的 CSS3 Page Transitions 模板和 fancybox 库。

一切都好，但是当我使用jquery.fancybox.js模板菜单链接不再起作用时，我单击它们并没有任何反应，不再发生转换。我怀疑两者都使用hrefs 有关系（模板是一个使用 s 的单页网站，调用图片href也是如此吗？）.js

抱歉我的英语不好并且没有成熟的问题，希望有人知道我在说什么并可以帮助我。干杯!

编辑：

非常感谢您的帮助，这里有 2 个链接，请注意页面上的所有内容都是我从网上复制的代码，没有任何内容是我的，仅用于测试目的。

不使用 jquery fancybox

这个你可以看到 jquery 正在发挥它的魔力，当你点击在投资组合中查看图像时，图像会正确显示，但菜单不再工作，你无法导航。

在没有 jquery fancybox 的情况下工作

这个没有jsquery的你可以看到导航正常工作并且页面转换发生但是当你点击投资组合中的视图缩略图时你只会看到.jpeg，当然......并且无法浏览图片。

非常感谢您的帮助，希望这是可以修复的，这样我就可以在页面转换工作的情况下拥有一个工作的 jquery fancybox 图像视图！

4

1 回答 1

0

杀死你的 CSS3 转换的不是花式框。问题是由您的script.js文件中的这一行创建的：

$('a').bind('click', function (event) {
  var $anchor = $(this);
  $('html, body').stop().animate({
    scrollTop: $($anchor.attr("href")).offset().top
  }, 1000, "easeOutExpo");
  event.preventDefault();
});

...您将网页中的所有event.preventDefault()锚点设置为，包括fancybox绑定到的那些锚点（ ）。<a class="fancybox" ...>

例如，如果您注释掉，event.preventDefault()那么您将让 fancybox 和 CSS3 过渡无缝地工作。

见JSFIDDLE

一般来说，绑定事件或将 css 规则应用于一般元素或标签并不是一个好主意，而是使用特异性，主要是当你有几个插件将其他事件绑定到这些元素时......所以而不是这样做

$('a')

做

$('a.selector')
于 2013-01-13T21:49:31.327 回答