jqueryとmootoolsの競合 - 1つのスクリプトが動作している、別のものがありません

Question

私はmootoolsを使ってGoogleマップからFlashコンテンツを表示しており、正しく動作させるために努力しています。反対に、jQueryは他のすべてのものにもっと役立つので、私はそれを一緒に働かせようとしています。それは説明のためです。ここにコードがあります。

私は/非表示のアニメーションを表示するために使用し、それが最近、MooToolsの完全

<script type="text/javascript"> 
jQuery(document).ready(function() { 
// hides the slickbox as soon as the DOM is ready 
jQuery('#slickbox').hide(); 
// toggles the slickbox on clicking the noted link 
    jQuery('#slick-toggle').click(function() { 
    jQuery('#slickbox').toggle(400); 
    return false; 
    }); 
}); 

と連携し、このjQueryのスクリプトは、私がメニューを流れるアニメーション化するSCRITを追加し、私はそれが仕事を得ることができません。私はnoConflictを適用しようとしましたが、動作しませんでした。ここでは、コードは次のようになります。

<script language="text/javascript"> 
var $j = jQuery.noConflict(); 
var name = "#floatMenu"; 
var menuYloc = null; 
    $j(document).ready(function(){ 
     menuYloc = parseInt($j(name).css("top").substring(0,$j(name).css("top").indexOf("px"))) 
     $j(window).scroll(function() { 
      offset = menuYloc+$(document).scrollTop()+"px"; 
      $j(name).animate({top:offset},{duration:500,queue:false}); 
     }); 
    }); 
</script> 

エラーメッセージがキャッチされない例外TypeErrorです：オブジェクト＃は方法はありません はどうもありがとうございました「処分します」。

Answer 1

このようにコードをフォーマットし、 noConflict()を使用する必要はありません。 jQueryとMooToolsのライブラリがロードされた直後にjQuery.noConflict();を呼び出します。

<script type="text/javascript"> 
(function($){ 
    var name = "#floatMenu", 
     menuYloc = null; 
    $(document).ready(function(){ 
     menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px"))) 
     $(window).scroll(function() { 
      var offset = menuYloc+$(document).scrollTop()+"px"; 
      $(name).animate({top:offset},{duration:500,queue:false}); 
     }); 
    }); 
})(jQuery); 
</script> 

これは、jQueryオブジェクトに渡される関数にコードをカプセル化します。その機能内で$を使用するところでは、jQueryを参照します。

はまた、値"text/javascript"を持つ属性languageありません、それはその価値を持っている必要がありtype属性、です。 language属性を使用しないでください。