0

我已经搜索了高和低的解决方案，但无法弄清楚。我是一个javascript菜鸟，所以我提前为我的无知道歉。我非常感谢您提供的任何帮助。

无论如何，我在一个页面上运行了两个 jquery 插件。一个是同位素，另一个是 Fancybox。它们都可以单独工作，但在一起时，当单击图像并激活 Fancybox 时，图像不会自动调整大小以适应屏幕。关于插件的其他一切工作正常。

我将这些 .js 脚本链接到：

https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
/js/jquery.isotope.js
/js/jquery.fancybox.js
/js/jquery.mousewheel-3.0.6.pack.js
/js/jquery.fancybox-buttons.js

然后这个脚本在文档中跟随它：

$(function(){

  var $container = $('#container');

  $container.isotope({
    itemSelector: '.project'
  });

});

$(".fancybox")
.attr('rel', 'gallery')
.fancybox({
    padding : 0 ,
    minWidth : 215 ,
    maxWidth : 900 ,
    autoSize : true ,
});

我尝试了各种方法，例如 no.conflict ，但要么我做错了，要么它不起作用。如果有人可以就如何分离这些脚本提供一些建议，我将不胜感激。

提前致谢。

4

1 回答 1

0

好的，我找到了解决方法。这有点奇怪，但是……无论如何。

我已将文档内脚本分成两个单独的脚本，并将链接的 .js 文件移动到每个脚本上方。然后，我为每个添加了对 jquery 库的单独调用。所以现在有两个对 jquery 的调用。它看起来像这样：

https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
/js/jquery.fancybox.js
/js/jquery.mousewheel-3.0.6.pack.js
/js/jquery.fancybox-buttons.js

$(".fancybox")
     .attr('rel', 'gallery')
     .fancybox({
        padding : 0 ,
        minWidth : 215 ,
        maxWidth : 900 ,
        autoSize : true ,
     });

https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
/js/jquery.isotope.js

$(function(){
   var $container = $('#container');
      $container.isotope({
      itemSelector: '.project'
  });    
});

我敢肯定这并不理想，但它确实有效，所以我不太在意。感谢蒂姆 B 詹姆斯的帮助。

于 2013-02-03T09:00:36.160 回答