jQuery y MooTools Conflicto

bien, así que tengo jQuery para llevarse bien con MooTools con un guión, añadiendo esta en la parte superior de la secuencia de comandos de jQuery:jQuery y MooTools Conflicto

var $j = jQuery.noConflict();

y volviendo a poner todos los registros:

$(

con

$j(

Pero ¿cómo llegar a MooTools como la siguiente secuencia de comandos que utiliza jQuery ??

Gracias de antemano por cualquier entrada,

Tracy

//Fade In Content Viewer: By JavaScript Kit: http://www.javascriptkit.com 

var fadecontentviewer={ 
csszindex: 100, 
fade:function($allcontents, togglerid, selected, speed){ 
    var selected=parseInt(selected) 
    var $togglerdiv=$("#"+togglerid) 
    var $target=$allcontents.eq(selected) 
    if ($target.length==0){ //if no content exists at this index position (ie: stemming from redundant pagination link) 
    alert("No content exists at page number "+selected+"!") 
    return 
    } 
    if ($togglerdiv.attr('lastselected')==null || parseInt($togglerdiv.attr('lastselected'))!=selected){ 
    var $toc=$("#"+togglerid+" .toc") 
    var $selectedlink=$toc.eq(selected) 
    $("#"+togglerid+" .next").attr('nextpage', (selected<$allcontents.length-1)? selected+1+'pg' : 0+'pg') 
    $("#"+togglerid+" .prev").attr('previouspage', (selected==0)? $allcontents.length-1+'pg' : selected-1+'pg') 
    $target.css({zIndex: this.csszindex++, visibility: 'visible'}) 
    $target.hide() 
    $target.fadeIn(speed) 
    $toc.removeClass('selected') 
    $selectedlink.addClass('selected') 
    $togglerdiv.attr('lastselected', selected+'pg') 
    } 
}, 

setuptoggler:function($allcontents, togglerid, speed){ 
    var $toc=$("#"+togglerid+" .toc") 
    $toc.each(function(index){ 
    $(this).attr('pagenumber', index+'pg') 
    }) 

    var $next=$("#"+togglerid+" .next") 
    var $prev=$("#"+togglerid+" .prev") 
    $next.click(function(){ 
    fadecontentviewer.fade($allcontents, togglerid, $(this).attr('nextpage'), speed) 
    return false 
    }) 
    $prev.click(function(){ 
    fadecontentviewer.fade($allcontents, togglerid, $(this).attr('previouspage'), speed) 
    return false 
    }) 
    $toc.click(function(){ 
    fadecontentviewer.fade($allcontents, togglerid, $(this).attr('pagenumber'), speed) 
    return false 
    }) 
}, 

init:function(fadeid, contentclass, togglerid, selected, speed){ 
    $(document).ready(function(){ 
    var faderheight=$("#"+fadeid).height() 
    var $fadecontents=$("#"+fadeid+" ."+contentclass) 
    $fadecontents.css({top: 0, left: 0, height: faderheight, visibility: 'hidden'}) 
    fadecontentviewer.setuptoggler($fadecontents, togglerid, speed) 
    setTimeout(function(){fadecontentviewer.fade($fadecontents, togglerid, selected, speed)}, 100) 
    $(window).bind('unload', function(){ //clean up 
    $("#"+togglerid+" .toc").unbind('click') 
    $("#"+togglerid+" .next", "#"+togglerid+" .prev").unbind('click') 
    }) 
    }) 
} 
}

Fuente

2010-05-11 flipflopmedia

De la misma manera que ya lo hizo ... reemplace '$ (' con '$ j (' . –

Eso no funciona porque no todos los $ están configurados como $ (para que simplemente pueda agregar un "j "entre los dos. Algunos son $ toc $ target $ selectedlink.ect ... En lugar del signo de dólar/paréntesis de apertura, tienes el signo/nombre de dólar. Si introduzco una" j ", realmente se arruina. – flipflopmedia

¡Me siento como un tonto! Lo hice, dejando los otros $ 'nombres' solos, ¡y funcionó! ¡Seré un SOB! Sin embargo, esto no habría funcionado sin la respuesta de Dimitar Christoff, porque independientemente, era primordial MooTools. La única forma de conseguir que los 2 guiones jQuery funcionen felizmente con el script 1 de MooTools fue reasignar $ en los 3 guiones. – flipflopmedia

No sé acerca de un modo de compatibilidad proporcionada por MooTools, pero una manera fácil debería ser reemplazar todas las apariciones de $( en el secuencia de comandos por $j( o jQuery(.

Fuente

2010-05-11 12:00:36

Fácil y sucio. –

Cuando usted tiene un código específico que está utilizando jQuery $, la forma más sencilla consiste en envolver el código con lo siguiente:

// Disable the $ global alias completely 
jQuery.noConflict(); 

// For jQuery scripts 
(function($){ 

// set a local $ variable only available in this block as an alias to jQuery 
... here is your jQuery specific code ... 

})(jQuery); 

// For Mootols scripts 
(function($){ 

// set a local $ variable only available in this block as an alias 
// to Mootools document.id 
... here is your Mootools specific code ... 

})(document.id);

Véase el segundo ejemplo de noConflict documentation.

Fuente

2010-05-11 12:12:42

Lo mismo es cierto a la inversa, es decir, mootools NO asumirá $ si ya está definido pero volverá a document.id (desde v1.2.1). a continuación, puede aplicar el mismo cierre, pero use 'document.id' en lugar de jQuery como el parámetro de $ –

Dimitar, usted estaba justo en la marca. Tuve que cambiar los 3 guiones para que funcionen (solo cambiar 1 guión no funcionó). Agregando var $ j = jQuery.noConflict() a las secuencias de comandos de JQuery, y agregando var $ = document.id; al guión de MooTools, y ahora todos trabajan felices juntos. Nunca hubiera funcionado sin tu comentario, y sugiriendo v1.2.1 Gracias U !! Vincent, por alguna razón, eso no funcionó en el script que pegué arriba. Funcionó en el otro 1 que había agregado var $ j = jQuery.noConflict(); Pero no en el 1 de arriba. Pero me alegra saber de ese consejo más corto para cuando funciona. – flipflopmedia

Incluí la solución Dimitar en mi respuesta para aclarar un poco a los desarrolladores de Mootools –

Reemplace $ con $jQuery y debería funcionar.

Fuente

2010-11-12 04:35:31 user416120

Respuesta

Cuestiones relacionadas