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 to the CF scene
    Join Date
    Apr 2011
    Posts
    6
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Over use of JS ?! nav bar not working with lightbox ? help ?

    Hello everyone,
    here we go: I've got nice nav bar with js, working perfect (got it at http://net.tutsplus.com/tutorials/de...vigation-menu/ ), now when I try to add rel="lightbox" to images, the lightbox doesn't work ? Here's the html, I'll explain more;

    Code:
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    	<title>untitled</title>
    	<link rel="stylesheet" href="css/style.css" type="text/css" />
     	<!--[if lt IE 8]>
    		<script src ="http://ie7-js.googlecode.com/svn/version/2.1(beta2)/IE8.js"></script>
    	<![endif]-->	
    </head>
    <body>
    
    <ul id="nav">
    	<li><a href="#">Home</a></li>
    	<li><a href="#">About</a>
    		<ul>
    			<li><a href="#">About Us</a></li>
    			<li><a href="#">About Them</a></li>
    			<li><a href="#">About You</a>
    				<ul>
    					<li><a href="#">More About Us</a></li>
    					<li><a href="#">More About Them</a></li>
    					<li><a href="#">More About You</a></li>						
    				</ul>
    			</li>						
    		</ul>
    	</li>
    	<li><a href="#">Portfolio</a></li>
    	<li><a href="#">Contact</a>
    		<ul>
    			<li><a href="#">International</a></li>
    			<li><a href="#">Corporate</a>
    				<ul>
    					<li><a href="#">International</a></li>
    					<li><a href="#">Corporate</a></li>
    					<li><a href="#">American Offices</a></li>
    				</ul>
    			</li>
    			<li><a href="#">American Offices</a></li>						
    		</ul>
    	</li>	
    	<li><a href="#">Mission Statement</a></li>		
    </ul>
         
    <p>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>	
      <script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js" type="text/javascript"></script>
    </p>
    <p>
      <img src="file:///C|/Users/Miha/Documents/_Blinds_.jpg" width="256" height="256">
      <script type="text/javascript" src="js/scripts.js"></script>
    </p>
    </body>
    </html>
    In order to install the "lightbox":
    You will need to include these three Javascript files in your header (in this order).
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>

    If I place these scripts in head - it wont work. If i delete the bottom three scripts which are used for nav bar then lightbox will work but then I shut off animation for nav bar? May-b someone had same problem and found solution where to put this three scripts from lightbox to work with nav bar ? (files for lightbox are in right position, styles are in right place, js is also located right - triple checked)

    Finished the whole d**n site and now the lighbox is eating my brains..
    Tried searching for the answer on google and other forums and didnt find answer so any idea at all is very welcome.

  • #2
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    I don't have experience of this myself, but I would suspect that havng three different libraries loaded that perform a similar role (jQuery, prototype and scriptaculous) plus your own script is likely to cause conflicts.

    Query has 'noConflict()' which can enable you to switch the use of the $ sign between the libraries. But it might prove tricky trying to discover where, precisely, the conflict originates.

    jQuery is your main library, so I would try to find a version of the lightbox that doesn't require prototype and scriptaculous.

  • Users who have thanked AndrewGSW for this post:

    Kanuto01 (04-22-2011)

  • #3
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    6
    Thanks
    3
    Thanked 0 Times in 0 Posts
    unfortunately I dont have experiences with js coding so I have no idea how would I make all that work but have decidet to delete scripts for nav bar and have a working lightbox for the time before i find solution to work both... Thank you for replying though, now I at least know where the problem is

  • #4
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Ok.

    But just to clarify, I'm not saying this is the cause of the problem. It could be just a simple typing error somewhere . But I suspect that there may be conflicts between the various libraries.

  • #5
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    just recently code hosted on googlecode.com seems to be being delivered as with the mime type application/empty so it is not working as plain text

    Try downloading all the JS that is on googlecode.com and putting it on your local server. I think that might solve your problem.


  •  

    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
    •