mototools和javascript之间的冲突都没有运行

时间:2013-08-04 21:48:28

标签: javascript jquery shared-libraries mootools conflict

我和JavaScript和Mototools之间存在冲突,我知道有类似NoConflict脚本的东西,但我不完全理解我怎样才能使它工作我会留下两个依赖的代码,以便它也可以解释我认为它对于遇到相同冲突的人来说非常有用,如果一个人工作,另一个人则不会。你可以看到它我部分工作但不完全www.softglobal.com.mx。谢谢

        <script type="text/javascript" src="jquery-1.2.2.pack.js" ></script>

        <script type='text/javascript'  src="  

         http://static.tumblr.com/5bbaxlr/2tlmqkzma/mototools.js">

      </script>

   <script type="text/javascript">
    //<![CDATA[
    var hoveroptions = {
    animout:                        'JAMenuhover_fade',
    animin:                         'JAMenuhover_fade',
    duration:                       400,
    transition:             Fx.Transitions.linear};
    window.addEvent ('domready', function (){
    if ($('ja-mainnav')) {
                    var items = $$('#ja-mainnav li a');
            new JAMenuhover (items,hoveroptions );
    }
   });
   //]]>
   </script>

这使得鼠标悬停在拖动效果上看起来很棒,但后来我得到了这是我之前的问题

     <script type="text/javascript"           
     src="http://ajax.googleapis.com/ajax/libs/
     jquery/1.4/jquery.min.js">
     </script>
     <script type="text/javascript">
      //<![CDATA[  
     jQuery(function() {
    var request = window.location.hash;
    if(request == '#page-2') {
    jQuery('.page.current').removeClass('current');
    jQuery('.page').eq(1).addClass('current');
     }
    jQuery('div ul li').click(function(){
    var speed = 600;
    var i = $(this).index();
    jQuery('.page.current').animate({opacity: 0, marginTop:80},speed,function(){
        jQuery(this).removeClass('current');
        jQuery('.page').eq(i).css('marginTop',30).animate({opacity:1,marginTop:    

         50},speed).addClass('current');        
         });
         });
         });

        //]]>
       </script>

1 个答案:

答案 0 :(得分:1)

我相信你的意思是MooToolsjQuery而不是MoToTools和JavaScript。

可以在技术上将这两个库组合在一起并使它们工作。但是不推荐,因为它们都做了类似的事情并且在页面上包含它们会带来 大量的开销 ,导致速度变慢页面渲染。

话虽如此,这是一个如何使用它们的例子:

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/mootools/1.4.5/mootools-yui-compressed.js"></script>

<p>jQuery sets this paragraph's color to red but MooTools sets the border color.</p>

<script>
//no conflict jquery
jQuery.noConflict();
//jquery stuff
(function($) {
    $('p').css('color','#ff0000');
})(jQuery);

//moo stuff
window.addEvent('domready',function() {
    $$('p').setStyle('border','1px solid #fc0');
});
</script>

注意:您的问题中显示的jQuery和MooTools的版本已经过时了,它们不太可能在没有太多故障和打嗝的新浏览器中工作,因此我使用了两个库的最新版本我的回答

在这里工作jsFiddle:http://jsfiddle.net/9zLQV/

示例代码的来源:http://davidwalsh.name/jquery-mootools