run 2 jquery versions error

Page 1 of 1

5 Replies - 954 Views - Last Post: 29 January 2013 - 06:31 AM

#1 hsl  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 3
  • Joined: 29-January 13

run 2 jquery versions error

Posted 29 January 2013 - 05:11 AM

i'm trying to run 2 versions of jquery but i getting errors at line 46
i need some help on this


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <!-- load jQuery 1.5.2 -->
    <script src="plugins/Bestgfx.com_EstroSlider/js/jquery-1.5.2.min.js"></script>


<!-- load jQuery 1.8.2 -->
    <script src="plugins/Responsive_Tile_Gallery-1.3/rtg-demo/javascript/jquery-1.8.2.min.js"></script>
    <script type="text/javascript">  
        $.noConflict(); 
        jQuery(document).ready(function($) 
        {    // Code that uses jQuery's $ can follow here.

            
                $('#myGallery').rtg({
                    imageWidth: 250,
                    spacing: 10,
                    categories: true,
                    categoryOptions: {
                        defaultCategory: 'First',
                        includeAll: false
                    },
                    captionOptions: {
                        enableCaptions: true
                    },
                    lightbox: true,
                    center: true,
                    initialHeight: 500
                });
            });

    
        jQuery(function ($) {
            $(".peKenBurns").peKenburnsSlider({ externalFont: true })
        })
        // for google fonts, handle captions sizing only after fonts are loaded
        jQuery(window).load(function () {
            $(".peKenBurns").each(function () {
                $(this).data("peKenburnsSlider").fontsLoaded()
            })
        })

    </script>
<%--Then, instead of $('#selector').function();, you'd do jQuery_1_5_2('#selector').function(); or jQuery_1_8_2('#selector').function();.--%>

    <!--Estro slider-->

        <!-- main stylesheets -->

        <link href="plugins/Bestgfx.com_EstroSlider/css/reset.css" rel="stylesheet" />
        <link href="plugins/Bestgfx.com_EstroSlider/css/text.css" rel="stylesheet" />
        <link href="plugins/Bestgfx.com_EstroSlider/css/960.css" rel="stylesheet" />
        <link href="plugins/Bestgfx.com_EstroSlider/css/preview.css" rel="stylesheet" />
        <link href="plugins/Bestgfx.com_EstroSlider/js/pe.kenburns/themes/default/skin.min.css" rel="stylesheet" />

       

    <!--specify size of slider-->
	<style>		
		.peKenBurns {
       		width: 920px;
       		height: 400px;
		}
	</style>
  
     <script src="plugins/Bestgfx.com_EstroSlider/js/preview.js"></script>

    <script src="plugins/Bestgfx.com_EstroSlider/js/pe.kenburns/jquery.pixelentity.kenburnsSlider.min.js"></script>
        <!-- end estro slider -->

        <!-- start rtg 1.3-->

        <link href="plugins/Responsive_Tile_Gallery-1.3/rtg-demo/css/style.css" rel="stylesheet" />
        <link href="plugins/Responsive_Tile_Gallery-1.3/rtg-demo/css/lightbox.css" rel="stylesheet" />
        <link href="plugins/Responsive_Tile_Gallery-1.3/rtg-demo/css/rtg.css" rel="stylesheet" />

        




    <script src="plugins/Responsive_Tile_Gallery-1.3/rtg-demo/javascript/rtg.js"></script>
        <script src="plugins/Responsive_Tile_Gallery-1.3/rtg-demo/javascript/lightbox.min.js"></script>
          <!-- end rtg 1.3-->

</head>
<body>
    <form id="form1" runat="server">
    <div>
    

        <!--start peKenBurns slider-->
			<div class="peKenBurns peNoJs" data-autopause="image" data-thumb="enabled" data-mode="kb" data-controls="always" data-shadow="enabled" data-logo="enabled">
				 
			   <div class="peKb_active" data-delay="5" data-thumb="img/thumbs/kb_01.jpg">
			   <img src="img/kb_01.jpg" alt="Banner Image 1" />
			   <h1>HI &amp; WELCOME TO THE "ESTRO" SLIDER BY PIXELENTITY</h1>

			   </div>
			   
			   <!-- lazy loading active -->
			   <div data-delay="5" data-thumb="img/thumbs/kb_00.jpg">
			   <a class="video hd autoplay loop" href="http://vimeo.com/7809605"><img src="img/blank.png" data-src="img/kb_00.jpg" alt="Banner Image 1" /></a>
			   <h1>A KICK-ASS JQUERY PLUGIN WITH KEN BURNS &amp; 2-WAY SWIPE TRANSITIONS</h1>
			   </div>
			   
			   <!-- lazy loading active -->

			   <div data-delay="5" data-thumb="img/thumbs/kb_02.jpg">
			   <img src="img/blank.png" data-src="img/kb_02.jpg" alt="Banner Image 1" />
			   <h1>FINE TUNED, SLEEK &amp; SMOOTH, THIS SLIDER WILL IMPRESS YOUR VISITORS</h1>
			   </div>
			   
			   <!-- lazy loading active -->
			   <div data-delay="5" data-thumb="img/thumbs/kb_03.jpg">
			   <img src="img/blank.png" data-src="img/kb_03.jpg" alt="Banner Image 1" />

			   <h1>SUPPORTS ANIMATED CAPTIONS, YOUTUBE &amp; VIMEO VIDEO, SINGLE PAGE MULTI-USE</h1>
			   </div>
			   
			   <!-- lazy loading active -->
			   <div data-delay="5" data-thumb="img/thumbs/kb_04.jpg">
			   <a class="video hd autoplay loop" href="http://www.youtube.com/watch?v=lZOnrN4x0Zk"><img src="img/blank.png" data-src="img/kb_04.jpg" alt="Banner Image 1" /></a>
			   <h1>CHOOSE FROM MULTIPLE SKINS TO SUIT YOUR OWN STYLE</h1>
			   </div>

			   
			   <!-- lazy loading active -->
			   <div data-delay="5" data-thumb="img/thumbs/kb_05.jpg">
			   <img src="img/blank.png" data-src="img/kb_05.jpg" alt="Banner Image 1" />
			   <h1>BONUS MINIMAL THUMBNAIL MODE WITH KEN BURNS ROLLOVER EFFECT </h1>
			   </div>
			   
			   <!-- lazy loading active -->
			   <div data-delay="5" data-thumb="img/thumbs/kb_06.jpg">
			   <img src="img/blank.png" data-src="img/kb_06.jpg" alt="Banner Image 1" />

			   <h1>GORGEOUS ANIMATED TIMER INTEGRATED INTO THE CURRENT SLIDE BUTTON</h1>
			   </div>
				 
			</div>	
			<!--end peKenBurns slider -->



        <!-- start rtg-->

        <!--All gallery markup is contained within .rtg-gallery-->
<div id='myGallery' class='rtg-gallery'>
    <div class='rtg-images'>
        <div data-category="Multiple Categories,First">
            <a href="images/lookbook/1.jpg" rel="lightbox[on]" title="Caption with <a target='_blank' href='http://www.andrewjmead.com'>link</a>"><img src='images/lookbook/1.jpg'/></a>
        </div>
        <div data-category="Second">
            <a href="images/lookbook/2.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/2.JPG'/></a>
        </div>
        <div data-category="Multiple Categories,First">
            <a href="images/lookbook/3.JPG" rel="lightbox[on]" title="Caption with no link"><img src='images/lookbook/3.JPG'/></a>
        </div>
        <div data-category="Second,Multiple Categories">
            <a href="images/lookbook/4.jpg" rel="lightbox[on]" title=""><img src='images/lookbook/4.jpg'/></a>
        </div>
        <div data-category="First">
            <a href="images/lookbook/5.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/5.JPG'/></a>
        </div>
        <div data-category="Second">
            <a href="images/lookbook/6.jpg" rel="lightbox[on]" title=""><img src='images/lookbook/6.jpg'/></a>
        </div>
        <div data-category="Multiple Categories,First">
            <a href="images/lookbook/7.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/7.JPG'/></a>
        </div>
        <div data-category="Second">
            <a href="images/lookbook/8.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/8.JPG'/></a>
        </div>
        <div data-category="Multiple Categories,First">
            <a href="images/lookbook/9.jpg" rel="lightbox[on]" title=""><img src='images/lookbook/9.jpg'/></a>
        </div>
        <div data-category="Multiple Categories,Second">
            <a href="images/lookbook/10.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/10.JPG'/></a>
        </div>
        <div data-category="First">
            <a href="images/lookbook/11.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/11.JPG'/></a>
        </div>
        <div data-category="Second">
            <a href="images/lookbook/12.jpg" rel="lightbox[on]" title=""><img src='images/lookbook/12.jpg'/></a>
        </div>
        <div data-category="First">
            <a href="images/lookbook/13.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/13.JPG'/></a>
        </div>
        <div data-category="Second">
            <a href="images/lookbook/14.JPG" rel="lightbox[on]" title=""><img src='images/lookbook/14.JPG'/></a>
        </div>
    </div>
</div>



      <!--end rtg-->


    </div>
    </form>
</body>


</html>


Is This A Good Question/Topic? 0
  • +

Replies To: run 2 jquery versions error

#2 andrewsw  Icon User is offline

  • Provides a RESTful service
  • member icon

Reputation: 1082
  • View blog
  • Posts: 3,371
  • Joined: 12-December 12

Re: run 2 jquery versions error

Posted 29 January 2013 - 05:18 AM

You haven't told us the error that you are receiving, but you cannot sensibly use two versions of jQuery. Prefer to use the more recent version of jQuery and just update any jQuery plug-ins that you use so that they work with this version.

Check the documentation for any plug-ins that you use to find out which versions of jQuery they are compatible with.

This post has been edited by andrewsw: 29 January 2013 - 05:18 AM

Was This Post Helpful? 0
  • +
  • -

#3 hsl  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 3
  • Joined: 29-January 13

Re: run 2 jquery versions error

Posted 29 January 2013 - 06:00 AM

hi,

i can update to the lastest verrsion the problem is thatb they dont work with the lastest version...
also according to this i can load and use 2 jquery version http://api.jquery.co...ery.noConflict/ thats what i'm trying to do but wont work.

the error is at line 46 the object is null or not difined - font loaded
Was This Post Helpful? 0
  • +
  • -

#4 andrewsw  Icon User is offline

  • Provides a RESTful service
  • member icon

Reputation: 1082
  • View blog
  • Posts: 3,371
  • Joined: 12-December 12

Re: run 2 jquery versions error

Posted 29 January 2013 - 06:16 AM

You should find the highest version number of jQuery that is compatible with all of your jQuery plug-ins; the highest common-factor, if you like. (This may not be the latest version of jQuery.)

noConflict is intended to allow jQuery to work alongside other JS frameworks such as prototype.js, etc.. Even then it is much the better option to stick to a single framework, and a single instance of this framework.

It is probably possible to use noConflict to enable two versions of jQuery to work, but I strongly advise against trying to do this.
Was This Post Helpful? 0
  • +
  • -

#5 hsl  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 3
  • Joined: 29-January 13

Re: run 2 jquery versions error

Posted 29 January 2013 - 06:27 AM

but i need to laod 2 jquery ersions if you know post
Was This Post Helpful? 0
  • +
  • -

#6 andrewsw  Icon User is offline

  • Provides a RESTful service
  • member icon

Reputation: 1082
  • View blog
  • Posts: 3,371
  • Joined: 12-December 12

Re: run 2 jquery versions error

Posted 29 January 2013 - 06:31 AM

View Posthsl, on 29 January 2013 - 06:27 AM, said:

but i need to laod 2 jquery ersions if you know post


Well, if you insist.

<script src='jquery-1.3.2.js'></script>
<script>
var jq132 = jQuery.noConflict();
</script>
<script src='jquery-1.4.2.js'></script>
<script>
var jq142 = jQuery.noConflict();
</script>

This post has been edited by andrewsw: 29 January 2013 - 06:33 AM

Was This Post Helpful? 0
  • +
  • -
Page 1 of 1