Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Sep 2009
    Posts
    20
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Javascript Errors!! Lightbox and toggle

    I am trying to get lightbox working on my site but am having a few problems,

    The only way i can get it to work is if I remove another section of javascript which controls a toggle sidebar

    Even if I just remove the jquery.min.js from the script below then the lightbox starts to work,

    I've tried calling lighbox first and moving it around but no luck, any ideas?

    Code:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    this is the rest of the code

    Code:
    <script type="text/javascript">
    jQuery(document).ready(function() {
      jQuery(".toggle-content").hide();
      //toggle the componenet with class msg_body
      jQuery(".link-toggle").click(function()
      {
        jQuery(this).next(".toggle-content").slideToggle(500);
      });
    });
    </script>

  • #2
    New Coder
    Join Date
    Sep 2009
    Posts
    20
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Sweet! just fixed it with no conflict

    Code:
    <script type="text/javascript">jQuery.noConflict();</script>
    Forgot all about this!!!

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,930
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    Your solution is not a solution, it’s just fixing the symptoms and shows me that you haven’t quite understood how to use jQuery (and you using jQuery 1.3.2 while we’re at version 1.7.1 shows that, too). Apparently you have included the framework twice which isn’t necessary in 99% of all cases. If you showed us your complete source code and not just a few lines, then we would even be able to help you actually fix your issue.

  • #4
    New Coder
    Join Date
    Sep 2009
    Posts
    20
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Yep your right I don't understand Jquery yet but i will learn soon

    ok so I only need to include the latest version of jQuery once?

    here's the rest of my code for the site

    Code:
    <!--Bing Webmasters Verification-->
    <meta name="msvalidate.01" content="97E40E7913B3EFAE99B0E62C2A3B2CEA" />
    <!--Google Webmasters Verification-->
    <meta name="google-site-verification" content="TEp_zmRBpKI11TgL7UGDBoR1WwMKsbzQ_G0awJiH1oU" />
    <!--Switch Content Used in Sidebar Navigation)-->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function() {
      jQuery(".toggle-content").hide();
      //toggle the componenet with class msg_body
      jQuery(".link-toggle").click(function()
      {
        jQuery(this).next(".toggle-content").slideToggle(500);
      });
    });
    </script>
    <script type="text/javascript">jQuery.noConflict();</script>
    
    
    <!--Tabs Files-->
    <!--<link rel="stylesheet" type="text/css" href="style/tabcontent.css" />
    
    <script type="text/javascript" src="applications/js/tabcontent.js">
    
    </script>-->
    <!--Contact Form validation-->
    <script src="information/information/free_validation.js"></script>
    <script>
    	required.add('Full_Name','NOT_EMPTY','Full Name');
    	required.add('Email_Address','EMAIL','Email Address');
    	required.add('Your_Message','NOT_EMPTY','Your Message')
    	</script>
    <script type="text/javascript">
    
    /* Modified to support Opera */
    function bookmarksite(title,url){
    if (window.sidebar) // firefox
    	window.sidebar.addPanel(title, url, "");
    else if(window.opera && window.print){ // opera
    	var elem = document.createElement('a');
    	elem.setAttribute('href',url);
    	elem.setAttribute('title',title);
    	elem.setAttribute('rel','sidebar');
    	elem.click();
    } 
    else if(document.all)// ie
    	window.external.AddFavorite(url, title);
    }
    </script>
    
    <!-- Start WOWSlider.com HEAD section -->
    	<link rel="stylesheet" type="text/css" href="information/information/applications/slider/engine1/style.css"/>
    	
    
    <script type="text/javascript" src="information/information/applications/slider/engine1/jquery.js"></script>
    	<script type="text/javascript" src="information/information/applications/slider/engine1/wowslider.js"></script>
    	<!-- End WOWSlider.com HEAD section -->
    
    <!-- Show Cart Content & Value -->
    <script type="text/javascript">
    function upDate(){
    qty="0"; sub="0.00";
    querystring=parent.document.URL.substring(document.URL.indexOf('?')+1);
    if (querystring.charAt(0)!="q"){querystring="";}
    if (querystring){
    today=new Date();
    millisecs_in_half_hour=1800000;
    expireDate = new Date(today.getTime() + millisecs_in_half_hour);
    document.cookie=querystring+"&exp="+expireDate+";path=/;expires="+expireDate.toGMTString();
    }else{
    if (document.cookie !=""){
    thisCookie=document.cookie.split("; ");
    for (i=0; i<thisCookie.length; i++) {
    if (thisCookie[i].split("=")[0]=="qty"){
    querystring=thisCookie[i];
    expireDate=thisCookie[i].split("exp=")[1];
    }}}}
    if (querystring){
    querystring=querystring.split("&");
    qty=querystring[0].split("=")[1]; if (qty==""){qty="0";}qty=parseInt(qty);
    sub=querystring[1].split("=")[1]; if (sub==""){sub="0.00";}
    }
    update=document.write("Items in cart: "+qty+"<br>Subtotal: "+sub+"");
    return update;
    }
    </script>
    
    <!-- Tabs for product pages -->
    <link rel="stylesheet" type="text/css" href="style/tabcontent-products.css" />
    
    <script type="text/javascript" src="applications/js/tabcontent-products.js">
    </script>
    
    <script type="text/javascript" src="applications/js/lightbox/prototype.js"></script>
    <script type="text/javascript" src="applications/js/lightbox/scriptaculous.js?load=effects,builder"></script>
    <script type="text/javascript" src="applications/js/lightbox/lightbox.js"></script>

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,930
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    Ah, no, I see. You used both, the jQuery and prototype libraries in one document. Since they are two different frameworks that do have similar function names, however, they are incompatible, and that’s why it wasn’t working. You should decide for one library (prototype, jQuery, or whatever else) and stick with it. And then you look for plugins/extensions for that one library. Since jQuery is the most popular JS framework, there are plugins for virtually everything, there are even multiple lightbox type plugins. So remove the lightbox you have right now and use one for jQuery. I can recommend fancybox. And remember: If you have included the core library file already you don’t need the jQuery file tha might be provided with the plugin.

  • Users who have thanked VIPStephan for this post:

    jon22 (02-07-2012)


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •