conflicto entre jquery y prototype

[maitep]

hola, buenas a todos

estoy haciendo una web donde tengo incluido el archivo prototype, quiero hacer las ventanas popup en jquery, pero hay conflicto entre los archivos.

http://yensdesign.com/2008/09/how-to...-using-jquery/

Tengo puesto esto en el archivo de jquery
jQuery.noConflict();
jQuery(document).ready(function($){

pero aun asi no funciona y me da este error

$(”#popupContact”) is null
var popupHeight=$(”#popupContact”).height();

solo si quito el archivo prototype funciona

como puedo dejar el archivo prototye y conseguir que el popup funcione.

muchas gracias a todos

[marcopoloaz06]

hola, así lo puedes solucionar

Código HTML:

<script type="text/javascript" src="http://prototypejs.org/assets/2008/9/29/prototype-1.6.0.3.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">

jQuery.noConflict();
(function($){
    $(document).ready(function(){
        $("#jQuery").html( "LOAD jQuery!" );
    });
})(jQuery);

Event.observe(window, 'load', function() {
    $("Prototype").innerHTML = "LOAD Prototype!";
});


</script>

<p id="jQuery">jQuery</p>
<p id="Prototype">Prototype</p> 

saludos
:]

[TresPuntoDos]

Para usar ambas librerias primero hay que cargar prototype y luego como bien dice Marcopoloaz06 tienes que usar la funcion de jQuery noConflict

Código:

jQuery(document).ready(
   function()
   {
      $j=jQuery.noConflict();
   }
);

De esa manera cuando uses $ sera para prototype y $j para jQuery

[willyfc]

yo no entedi bien esa explicacion podrian ser un poquito mas claros por favor, ya tengo llamado el prototype antes que el jquery

Código HTML:

<script type="text/javascript" src="../Scripts/prototype.js"></script>
<script type="text/javascript" src="../Scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="../Scripts/lightbox.js"></script>
<script type="text/javascript" src="../Scripts/jquery-1.2.3.min.js"></script>
<script type="text/javascript">

jQuery.noConflict();
(function($){
    $(document).ready(function(){
        $("#jQuery").html( "LOAD jQuery!" );
    });
})(jQuery);

Event.observe(window, 'load', function() {
    $("Prototype").innerHTML = "LOAD Prototype!";
});


</script> 

pero lo otro que dice TresPuntoDos donde lo coloco

gracias

[TresPuntoDos]

Prueba esto:

Código HTML:

<script type="text/javascript" src="../Scripts/prototype.js"></script>
<script type="text/javascript" src="../Scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="../Scripts/lightbox.js"></script>
<script type="text/javascript" src="../Scripts/jquery-1.2.3.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(
   function()
   {
      $j=jQuery.noConflict();
      $("Prototype").innerHTML = "LOAD Prototype!";
   }
);
</script> 

[marcelonologo]

Me sucede algo parecido pero con este código:

Código:

 setup:function(config){ 
      //Disable Step Gallery scrollbars ASAP dynamically (enabled for sake of users with JS disabled) 
      document.write('<style type="text/css">\n#'+config.galleryid+'{overflow: hidden;}\n</style>') 
      jQuery(document).ready(function($){ 
         config.$gallery=$('#'+config.galleryid) 
         config.gallerywidth=config.$gallery.width() 
         config.offsets={left:stepcarousel.getoffset(config.$gallery.get(0), "offsetLeft"), top:stepcarousel.getoffset(config.$gallery.get(0), "offsetTop")} 
         config.$belt=config.$gallery.find('.'+config.beltclass) //Find Belt DIV that contains all the panels 
         config.$panels=config.$gallery.find('.'+config.panelclass) //Find Panel DIVs that each contain a slide 
         config.panelbehavior.wraparound=(config.autostep && config.autostep.enable)? true : config.panelbehavior.wraparound //if auto step enabled, set "wraparound" to true 
         config.onpanelclick=(typeof config.onpanelclick=="undefined")? function(target){} : config.onpanelclick //attach custom "onpanelclick" event handler 
         config.onslideaction=(typeof config.onslide=="undefined")? function(){} : function(beltobj){$(beltobj).stop(); config.onslide()} //attach custom "onslide" event handler 
         config.oninit=(typeof config.oninit=="undefined")? function(){} : config.oninit //attach custom "oninit" event handler 
         config.beltoffset=stepcarousel.getCSSValue(config.$belt.css('marginLeft')) //Find length of Belt DIV's left margin 
         config.statusvars=config.statusvars || []  //get variable names that will hold "start", "end", and "total" slides info 
         config.$statusobjs=[$('#'+config.statusvars[0]), $('#'+config.statusvars[1]), $('#'+config.statusvars[2])] 
         config.currentpanel=0 
         stepcarousel.configholder[config.galleryid]=config //store config parameter as a variable 
         if (config.contenttype[0]=="ajax" && typeof config.contenttype[1]!="undefined") //fetch ajax content? 
            stepcarousel.getremotepanels($, config) 
         else 
            stepcarousel.alignpanels($, config) //align panels and initialize gallery 
      }) //end document.ready 
      jQuery(window).bind('unload', function(){ //clean up 
         if (config.panelbehavior.persist){ 
            stepcarousel.setCookie(window[config.galleryid+"persist"], config.currentpanel) 
         } 
         jQuery.each(config, function(ai, oi){ 
            oi=null 
         }) 
         config=null 
      }) 
   } 
}

Si alguien me puede dar una mano se lo agradecería.

Saludos