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
    Sep 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Jquery and Prototype conflict: Please help!

    I have no idea about javascript coding usually just follow tutorials but i cant find any:
    I am having a jquery and prototype conflict

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1.6.1/prototype.js'></script>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js'></script>
    <script type='text/javascript' src='/lightview.js'></script>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script> 
    <script type="text/javascript" src="/photography/js/scrollable.js"></script>
    <script>
      jQuery.noConflict();
      
      // Use jQuery via jQuery(...)
      jQuery(document).ready(function(){
        jQuery("div.scrollable").hide();
      });
      
      // Use Prototype with $(...), etc.
      $('div.box').hide();
    </script>
    
    
    <link rel="stylesheet" type="text/css" href="/lightview.css" />
    <link rel="stylesheet" href="/photo.css" type="text/css" media="screen" charset="utf-8" />
    
    
    	<title>untitled</title>
    	
    </head>
    
    <body>
    	<div id="wrapped">
    		<div id="centered">
    			<div id="slideshow">
    					<a class="prev browse left"></a>
    			<a class="next browse right"></a>
    			<div class="scrollable">
    					<div class="items" id="response">	
    	<div class="box col1 ">
    <a href='image.jpg' class='lightview'>My image</a></div>
    	<div class="box col1 ">
    <a href='/photography/photos/china1.jpg' class='lightview'>China 1</a></div>
    
    </div></div>
    </div></div></div><!--slideshow-->
    
    <script> 
    	$(document).ready(function() {});
    
    		$("div.scrollable").scrollable({
    			keyboardSteps: 1,
    			clickable: true,
    			keyboard: 'static',
    			size: 1,
    			loop: true,
    		});
    		</script>
    
    </body>
    </html>
    Any help?

  • #2
    New to the CF scene
    Join Date
    Sep 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Anyone?

  • #3
    Senior Coder Spudhead's Avatar
    Join Date
    Jun 2002
    Location
    London, UK
    Posts
    1,856
    Thanks
    8
    Thanked 110 Times in 109 Posts
    I don't think you're using noConflict() correctly.

    Have a look at the example code in the docs.

    Also, I'm not sure what that bit down the bottom is supposed to be doing but you can't use jQuery's

    Code:
    $(document).ready(function() {});
    if you've just assigned $ to prototype.

  • #4
    New to the CF scene
    Join Date
    Sep 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Spudhead View Post
    I don't think you're using noConflict() correctly.

    Have a look at the example code in the docs.

    Also, I'm not sure what that bit down the bottom is supposed to be doing but you can't use jQuery's

    Code:
    $(document).ready(function() {});
    if you've just assigned $ to prototype.

    Ah okay thanks, i read thr noConflict document, but as I said I really don't have any knowledge of javascript so it isn't making much sense to me.

  • #5
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,444
    Thanks
    11
    Thanked 598 Times in 578 Posts
    if just jQuery, jQuery===$...

    thus:

    Code:
    jQuery(document).ready(function() {});
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%


  •  

    Posting Permissions

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