Conflicto entre librerias jQuery

ceaped · #1 (**permalink**) 22/01/2014, 10:36

Buenos días

Tengo conflicto cuando utilizo así estas librerías:

Código Javascript:

Ver original<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.colorbox.js"></script>
 
<script type="text/javascript" src="js/tooltip/scripts.js"></script>
<script type="text/javascript" src="js/tooltip/jquery.tooltipster.js"></script>

El asunto redica con este:

Código Javascript:

Ver original<script type="text/javascript" src="js/jquery.min.js"></script>

¿Cómo puedo utilizar estas librerías?

Gracias por su ayuda

PHPeros · #2 (**permalink**) 22/01/2014, 10:45

¿Tienes conflicto?

Usa jQuery.noConflict()

ceaped · #3 (**permalink**) 22/01/2014, 11:54

Hola PHPeros

Así tengo la estructura de mi página y no me funciona.

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es">
 
    <head>
    <title>titulo</title>
        
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="favicon.png" rel="shortcut icon" type="image/png">
    <!--[if lt IE 9]>
    <script type="text/javascript">
    "'article aside footer header nav section time'".replace(/\w+/g,function(n){document.createElement(n)});
    </script>
    <![endif]-->
    
    <script type="text/javascript">
    jQuery.noConflict();
    </script>
    
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery.colorbox.js"></script>   
    
    <script src="js/tooltip.js" type="text/javascript"></script>
    
    
    <script>
    $(document).ready(function(){
    //Examples of how to assign the Colorbox event to elements
    $(".group1").colorbox({rel:'group1'});
    $(".group2").colorbox({rel:'group2', transition:"fade"});
    $(".group3").colorbox({rel:'group3', transition:"none", width:"75%", height:"75%"});
    $(".group4").colorbox({rel:'group4', slideshow:true});
    $(".ajax").colorbox();
    $(".youtube").colorbox({iframe:true, innerWidth:425, innerHeight:344});
    $(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409});
    $(".iframe").colorbox({iframe:true, width:530, height:400});
    $(".inline").colorbox({inline:true, width:"50%"});
    //$('.inline').colorbox({rel:'inline',width:'50%',height:'50%'}).mouseover(function(){ $(this).click();  }); 
    $(".callbacks").colorbox({
    onOpen:function(){ alert('Abrir: colorbox se esta abriendo'); },
    onLoad:function(){ alert('Cargando: colorbox ha empezado a cargar el contenido específico'); },
    onComplete:function(){ alert('Completo: colorbox has displayed the loaded content'); },
    onCleanup:function(){ alert('Limpiar: colorbox ha mostrado el contenido cargado'); },
    onClosed:function(){ alert('Cerrar: colorbox ha cerrado por completo'); }
    });
 
    $('.non-retina').colorbox({rel:'group5', transition:'none'})
    $('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true});
                
    //Example of preserving a JavaScript event for inline calls.
    $("#click").click(function(){ 
    $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Abra la ventana de nuevo y este mensaje seguirá aquí.");
    return false;
    });
    });
    </script>
     
    <script type="text/javascript">
    $(document).ready(function() {
    $('.pestana').hide().eq(0).show();
    $('.tabs li').click(function(e){
    e.preventDefault();
    e.stopPropagation();
    $('.pestana').hide();
    $('.tabs li').removeClass("selected");
    var id = $(this).find("a").attr("href");
    $(id).fadeToggle();
    $(this).addClass("selected");
    });
    });
    </script>
 
</head>
    
    <body>
    
    </body>
</html>

¿Donde debo poner ese código?

Gracias por tu ayuda