主题和图库Javascript之间的Wordpress中的Javascript冲突

时间:2015-06-01 14:19:51

标签: javascript jquery wordpress

我一直在为一个特定的合理画廊工作超过我想承认的时间,但我终于设法让画廊看起来我需要和所有的JavaScript工作。

我在Dreamweaver中完成了所有测试,但是当它最终将我所拥有的内容移动到我的Wordpress网站时,似乎与网站上已有的一些javascript和我需要使我的图库工作的JavaScript有冲突。

我已将所有自定义javascript包含在页脚中,如下所示:

JAVASCRIPT

<script src="http://dangoodeofficial.co.uk/wp-content/plugins/Justified-Gallery/libs/jquery/jquery.min.js"></script>

<script src="http://dangoodeofficial.co.uk/wp-content/plugins/Justified-Gallery/dist/js/jquery.justifiedGallery.min.js"></script>  

<link rel="stylesheet" href="http://dangoodeofficial.co.uk/wp-content/plugins/Justified-Gallery/dist/css/justifiedGallery.min.css" type="text/css" media="all">

  <script>
jQuery(document).ready(function($) {
  $('.x-nav > li.current-menu-item').removeClass("current-menu-item");
});
</script>

<script type="text/javascript">
jQuery( document ).ready(function() {       
jQuery('.flip-btn-1').click(function(e) {
  e.preventDefault();
    jQuery(".front").toggleClass('flip');
            jQuery(".back").toggleClass('flip');
        });
});

jQuery( document ).ready(function() {       
jQuery('.flip-btn-2').click(function(e) {
  e.preventDefault();
    jQuery(".front2").toggleClass('flip2');
            jQuery(".back2").toggleClass('flip2');
        });
});
</script>

   <script>

    $('#liveDemo').justifiedGallery({
        rowHeight : 190,
        sizeRangeSuffixes: {
            'lt100':'_t', 
            'lt240':'_m', 
            'lt320':'_n', 
            'lt500':'', 
            'lt640':'_z', 
            'lt1024':'_b'
        }
    }).on('jg.complete', function () {
        $(this).find('a').colorbox(colorboxConf);

    });

</script>

我已经弄明白导致冲突的原因是jquery.min.js它正在阻止Revolution Slider工作,并且还会导致问题滑块出现问题(它会立即显示所有幻灯片),以及我的固定导航酒吧不再固定。

有没有办法找出导致冲突的原因?

有问题的网站是www.dangoodeofficial.co.uk

谢谢,

2 个答案:

答案 0 :(得分:0)

您不应通过链接在页脚中包含jquery.justifiedGallery.min.jsjQuery等Javascript库;你需要在主题的functions.php文件中正确地将Word中的Javascript排入队列。见https://codex.wordpress.org/Function_Reference/wp_enqueue_script

因此,您有两个正在加载的主jQuery库的副本。

可以使用<script type="text/javascript">**</script>标记在页眉或页脚中添加jQuery文档就绪函数。

您在控制台中遇到了很多Javascript错误。使用Firefox(或Firebug)或ChromeSafariIE中的开发者工具,查看您网站上正在加载的javascript以及错误。< / p>

答案 1 :(得分:0)

冲突的原因可能是包含jquery.js文件。您不需要在插件中单独包含jquery。默认情况下,WordPress附带一个jquery文件,可以现成使用。