+ Rispondi alla Discussione
Risultati da 1 a 8 di 8

conflitto tra lightbox e jquery

Ultimo Messaggio di m_dimarte il:
  1. #1
    Utente Premium
    Data Registrazione
    Oct 2008
    Messaggi
    255

    conflitto tra lightbox e jquery

    Non è proprio possibbile usarli tutte due insieme?
    Questa e la parte di codice html:

    <script type="text/javascript" src="lightbox2.04/js/prototype.js"></script>
    <script type="text/javascript" src="lightbox2.04/js/scriptaculous.js"></script>
    <script type="text/javascript" src="lightbox2.04/js/lightbox.js"></script>


    <script src="JS/jquery/jquery.js"type="text/javascript"></script>
    <script src="JS/jquery/jquery.wslide.js" type="text/javascript"></script>
    <script type="text/javascript" charset="utf-8">
    $(document).ready(function(){

    $("#parent2").wslide({
    width: 850,
    height: 250,
    autolink:'welcome',
    fade: true,
    duration: 2000
    });
    });

    </script>


    Il jquery funziona in ogni caso,
    il lightbox funziona solo al momento che nn ce jquery!

    Come risolvere?

  2. #2
    Moderatore L'avatar di Shad
    Data Registrazione
    Jun 2007
    Località
    Napoli
    Messaggi
    664
    Segui Shad su Twitter Aggiungi Shad su Linkedin
    Devi usare il noConflict.
    In questo modo per usare le chiamate JQuery basterà scrivere jQuery al posto del $, mentre quest'ultimo continuerà ad essere riservato per l'altra libreria (nel tuo caso prototype).

    Eccoti un esempio:
    Codice:
    jQuery.noConflict();
     
    jQuery(document).ready(function(){
      // fai qualcosa con JQuery
    });
     
    // Questa viene fatta usando prototype
    $('id').hide();

  3. #3
    User
    Data Registrazione
    Mar 2010
    Località
    nel mio mondo
    Messaggi
    248
    Citazione Originariamente Scritto da Shad Visualizza Messaggio
    Devi usare il noConflict.
    In questo modo per usare le chiamate JQuery basterà scrivere jQuery al posto del $, mentre quest'ultimo continuerà ad essere riservato per l'altra libreria (nel tuo caso prototype).

    Eccoti un esempio:
    Codice:
    jQuery.noConflict();
     
    jQuery(document).ready(function(){
      // fai qualcosa con JQuery
    });
     
    // Questa viene fatta usando prototype
    $('id').hide();

    Ciao, ho cambiato un menù dal sito che sto realizzando, passando da un menù flash ad uno jquery, il menù funziona bene, il problema è che nelle pagine dove ho i prodotti, che hanno una lightbox va in conflitto.
    Riprendo questo post di un altro utente di quasi un anno fa, perchè sembra lo stesso problema, ho provato ad utilizzare il metodo che hai proposto tu, prima senza quest'ultimo non mi funzionava più il lightbox, ora il lightbox funziona però il problema resta nel menù che non restano inattive le animazioni. potreste aiutarmi? grazie!

    questi sono i codici che ho inserito

    <script type='text/javascript' src='js/jquery-1.3.2.min.js'></script>
    <script type='text/javascript' src='js/jquery.easing.1.3.js'></script>
    <script type='text/javascript' src='js/jquery.spritemenu-0.2.js'></script>
    <script type='text/javascript'>
    jQuery(document).ready(function(){
    jQuery('#menu').spritemenu({
    grid:"images/menu.png",
    buttonwidth: 110,
    buttonheight: 40,
    speed: 'slow',
    easing: 'easeOutBounce', //You need the easing plugin for anything other than 'swing' or 'linear'
    animate: 'height'
    });
    jQuery('#menu2').spritemenu({
    grid:"images/menu.png",
    buttonwidth: 110,
    buttonheight: 40
    });
    });
    var jQuery = jQuery.noConflict();

    // Questa viene fatta usando prototype
    $('pic').hide();
    </script>


    //poi dove ho il lightbox

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

  4. #4
    User
    Data Registrazione
    Dec 2009
    Messaggi
    20
    ciao a tutti

    io ho il problema far coesistere due java script... inserendo le varianti a $ il tool la riconosce ma cmq non fa l'effetto desiderato ti allego il codice...HELP MEEEEEEEEEE

    <script type="text/javascript" src="jQuery.js"></script>
    <script type="text/javascript" src="ScrollNews.jquery.js"></script>
    <script language="javascript" >
    <!--
    jQuery(document).ready(function(){
    jQuery("#generale").ScrollNews({
    inizialize : 'true',
    size : '130px',
    timeout : 2500,
    speed : 'fast',
    direction : 'down',
    onmouseover : 'stop'
    });
    });
    -->
    var jQuery = jQuery.noConflict();
    </script>
    <script type="text/javascript" src="mootools-beta-1.2b2.js"></script>
    <script type="text/javascript" src="MooFlow.js"></script>
    <script type="text/javascript" src="MooFlowViewer.js"></script>
    <script type="text/javascript">
    /* <![CDATA[ */

    var myMooFlowPage = {

    start: function(){
    /* MooFlow instance with the complete UI and Viewer */
    var mf = new MooFlow($('MooFlow'), {
    useSlider: true,
    useAutoPlay: true,
    useCaption: true,
    useResize: true,
    useMouseWheel: true,
    useKeyInput: true,
    useViewer: true
    });

    mf.attachViewer();

    $$('.loadremote').addEvent('click', function(){
    mf.loadHTML(this.get('a href'), this.get('rel'));
    return false;
    });

    }

    };

    window.addEvent('domready', myMooFlowPage.start);

    /* ]]> */
    function MM_goToURL() { //v3.0
    var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
    for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
    }
    </script>

  5. #5
    User
    Data Registrazione
    Mar 2012
    Località
    Pesaro
    Messaggi
    19
    Ciao a tutti ragazzi,
    anche io ho un problema di conflitto tra jQuery e lightbox......ma il no.conflit per me non vale dato che nn ho nel mio codice variabili $

    Premetto che nn è necessario per forza cambiare lightbox, magari basta avere un'altra funzione per la sfumatura dell'immagine in header (che tra l'altro nn funziona nemmeno bene -.- )

    cmq ecco il codice che ho inserito:

    <!-- APERTURA FINESTRA ESTERNA -->
    <script type="text/javascript" src="js/targetBlank.js"></script>

    <!-- LIGHTBOX -->
    <script src="js/prototype.js" type="text/javascript"></script>
    <script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
    <script src="js/lightbox.js" type="text/javascript"></script>

    <!-- EFFETTO FOTO HEAD -->
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/script.js"></script>

    <!-- CAROUSEL -->
    <script type="text/javascript" src="js/jquery.jcarousel.min.js"></script>

    <script type="text/javascript">

    jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel();
    });

    </script>

    Grazie mille a tutti coloro che mi daranno una mano
    Ciao Daniele

  6. #6
    User Attivo L'avatar di ayrton2001
    Data Registrazione
    Jul 2006
    Località
    Bagheria
    Messaggi
    1,174
    Segui ayrton2001 su Twitter Aggiungi ayrton2001 su Google+ Aggiungi ayrton2001 su Facebook Aggiungi ayrton2001 su Linkedin Visita il canale Youtube di ayrton2001
    Citazione Originariamente Scritto da PI74image Visualizza Messaggio
    Ciao a tutti ragazzi,
    anche io ho un problema di conflitto tra jQuery e lightbox......ma il no.conflit per me non vale dato che nn ho nel mio codice variabili $

    Premetto che nn è necessario per forza cambiare lightbox, magari basta avere un'altra funzione per la sfumatura dell'immagine in header (che tra l'altro nn funziona nemmeno bene -.- )
    Ciao Daniele,
    perché non utilizzi il jQuery lightBox plugin ?
    Leggimi su Andrea Cardinale | Seguimi su Twitter e Google+

  7. #7
    User
    Data Registrazione
    Mar 2012
    Località
    Pesaro
    Messaggi
    19
    Ho risolto usando shadowbox invece del lightbox
    Ora sembra andare tutto bene...grazie cmq a tutti x il supporto

    ciao Daniele

  8. #8
    User Newbie
    Data Registrazione
    Jun 2012
    Località
    Roma
    Messaggi
    1

    Conflitto tra jCarousel e lightbox

    Salve a tutti.
    Vi espongo subito il mio problema, spero qualcuno possa aiutarmi il prima possibile.
    La pagina "Works" del sito che sto sviluppando dovrebbe essere composta da vari carousel orizzontali, uno per ogni sezione Works, ognuno di questi integrato con dei lightbox che permettano di navigare tra i lavori singoli, visualizzandoli a tutta pagina.
    Ho già avuto molti problemi per trovare un carousel che permettesse di caricare più gallerie indipendenti sulla stessa pagina (ho usato jcarousel di sorgalla ); solo che non appena integro lo script di un qualsiasi lightbox (ho provato con più di uno) mi si smonta tutto la unordered list, tutti gli elementi mi si posizionano in verticale.
    Vi alleggo l'html della pagina:


    <!-- collegamento al css del carousel --->
    <link rel="stylesheet" type="text/css" href="jsor-jcarousel-7bb2e0a/skins/tango/skin.css" />


    <!-- collegamento allo script del carousel --->
    <script type="text/javascript" src="jsor-jcarousel-7bb2e0a/lib/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="jsor-jcarousel-7bb2e0a/lib/jquery.jcarousel.min.js"></script>


    <script type="text/javascript">
    jQuery(document).ready(function() {
    jQuery('.first-and-second-carousel').jcarousel({
    scroll: 5,
    wrap: 'last'
    });
    });
    </script>




    <!-- collegamento al css del lightbox --->
    <link rel="stylesheet" type="text/css" href="lightbox/css/jquery.lightbox-0.5.css"/>


    <!-- collegamento allo script del lightbox --->
    <script type="text/javascript" src="lightbox/js/jquery.js"></script>
    <script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.js"></script>




    <script type="text/javascript">
    $(function() {

    $('a').lightBox();
    });
    </script>


    <div class="jcarousel-skin-tango">
    <div class="jcarousel-container">
    <div class="jcarousel-clip">
    <ul id="first-carousel" class="first-and-second-carousel jcarousel-skin-tango">

    <li><img src="immagini/works/infographics_s1.png" /></li>
    <li><img src="immagini/works/infographics_s2.png" /></li>
    <li><img src="immagini/works/infographics_s3.png" /></li>
    <li><img src="immagini/works/infographics_s4.png" /></li>
    <li><img src="immagini/works/infographics_s5.png" /></li>
    <li><a href="immagini/latestworks_1.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_2.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_1.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_2.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_1.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_2.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_1.png"><img src="immagini/works/infographics_w1.png" /></a></li>
    <li><a href="immagini/latestworks_2.png"><img src="immagini/works/infographics_w1.png" /></a></li>

    </ul>
    </div>
    <div disabled="disabled" class="jcarousel-prev jcarousel-prev-disabled"></div>
    <div class="jcarousel-next"></div>
    </div>
    <img src="immagini/linea1px.png" width="960" height="2" /></div>



    <div class="jcarousel-skin-tango">
    <div class="jcarousel-container">
    <div class="jcarousel-clip">
    <ul id="second-carousel" class="first-and-second-carousel jcarousel-skin-tango">

    <li><img src="immagini/works/infographics_s1.png" /></li>
    <li><img src="immagini/works/infographics_s2.png" /></li>
    <li><img src="immagini/works/infographics_s3.png" /></li>
    <li><img src="immagini/works/infographics_s4.png" /></li>
    <li><img src="immagini/works/infographics_s5.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>
    <li><img src="immagini/works/infographics_w1.png" /></li>

    </ul>
    </div>
    <div disabled="disabled" class="jcarousel-prev jcarousel-prev-disabled"></div>
    <div class="jcarousel-next"></div>
    </div>
    <img src="immagini/linea1px.png" width="960" height="2" /></div>



    Premetto che non sono un programmatore, ma studio graphic design, il sito è un progetto d'esame per il corso di web design, che, purtroppo, è stato svolto in maniera piuttosto sommaria... Spero che qualcuno mi possa dare qualche consiglio, il prima possibile che l'esame è alle porte...
    Grazie mille!

+ Rispondi alla Discussione

^ Permessi di Scrittura

  • Tu non puoi inviare nuove discussioni
  • Tu non puoi inviare risposte
  • Tu non puoi inviare allegati
  • Tu non puoi modificare i tuoi messaggi
  •  
  • Il codice BB è Attivato
  • Le faccine sono Attivato
  • Il codice [IMG] è Attivato
  • Il codice [VIDEO] è Attivato
  • Il codice HTML è Disattivato
  • Trackbacks Attivato
  • Pingback Attivato
  • Refback Attivato

SEO by vBSEO 3.6.0 PL2 ©2011, Crawlability, Inc.