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 6 of 6
  1. #1
    New Coder
    Join Date
    Apr 2012
    Posts
    78
    Thanks
    0
    Thanked 0 Times in 0 Posts

    two js files conflicting

    Hi

    In my header.php file I am using a nivoslider and a normal fade in slideshow

    Issue is the two js files are conflicting

    The coding with the two files is below

    Code:
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    
    <script src="./js/jquery.nivo.slider.pack.js" type="text/javascript"></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="./js/fadeslideshow.js"></script>
    Have also got the following

    Code:
    <script type="text/javascript">
    
    var mygallery=new fadeSlideShow({
    	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
    	dimensions: [280, 250], //width/height of gallery in pixels. Should reflect dimensions of largest image
    	imagearray: [
    		["images/team.jpg"],
    		["images/team2.jpg"],
    		["images/team3.jpg"],
    		["images/team4.jpg"]
    	],
    	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
    	persist: false, //remember last viewed slide and recall within same session?
    	fadeduration: 500, //transition duration (milliseconds)
    	descreveal: "always",
    	togglerid: ""
    })
    
    </script>
    and

    Code:
      <script type="text/javascript">
    
    $(window).load(function() {
        $('#slider').nivoSlider({
            effect: 'boxRainReverse', // Specify sets like: 'fold,fade,sliceDown'
            slices: 15, // For slice animations
            boxCols: 8, // For box animations
            boxRows: 4, // For box animations
            animSpeed: 500, // Slide transition speed
            pauseTime: 3000, // How long each slide will show
            startSlide: 0, // Set starting Slide (0 index)
            directionNav: true, // Next & Prev navigation
            controlNav: true, // 1,2,3... navigation
            controlNavThumbs: false, // Use thumbnails for Control Nav
            pauseOnHover: true, // Stop animation while hovering
            manualAdvance: false, // Force manual transitions
            prevText: 'Prev', // Prev directionNav text
            nextText: 'Next', // Next directionNav text
            randomStart: false, // Start on a random slide
            beforeChange: function(){}, // Triggers before a slide transition
            afterChange: function(){}, // Triggers after a slide transition
            slideshowEnd: function(){}, // Triggers after all slides have been shown
            lastSlide: function(){}, // Triggers when last slide is shown
            afterLoad: function(){} // Triggers when slider has loaded
        });
    });
    </script>
    I have tried but does not work

    Code:
    <script>
         jQuery.noConflict();
    
         // Use jQuery via jQuery(...)
         jQuery(document).ready(function(){
           jQuery('slider').show();
         });
    
         // Use Prototype with $(...), etc.
         $('fadeshow1').show();
       </script>
    Any ideas on how to get the two working together without conflicting

    Kind regards

    Ian

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    http://www.codingforums.com/showthread.php?t=271898

    It is your responsibility to die() if necessary….. - PHP Manual

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    New Coder
    Join Date
    Jun 2013
    Location
    Sri lanka
    Posts
    12
    Thanks
    1
    Thanked 1 Time in 1 Post
    Isn't it possible for you use Nivo Slider itself to get the same output for the fadeslideshow ? Just use ID #slider2 or some new id name and this will sort out the issue hopefully... sometimes this confilcts happen, i too had come across them at various time.. so most of the time I try to go with an alternative which is more easier.. =)

  • #4
    New Coder
    Join Date
    Apr 2012
    Posts
    78
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi Rgwebdesign

    That was my next idea to try if could not get the two different slideshows working together lol

    Thank you for the info, really appreciate it, works perfect now

    Kind regards

    Ian

  • #5
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    If you both took the time to read the post Philip linked, you would realize that you have included more than one version of the jQuery framework on your page. I suggest you review the post he linked : http://www.codingforums.com/showthread.php?t=271898

    also noconflict is for working with javacsript libnraries other than jQuery on the same page as jQuery.
    (http://learn.jquery.com/using-jquery...her-libraries/)

  • #6
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,696
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Quote Originally Posted by DanInMa View Post
    also noconflict is for working with javacsript libnraries other than jQuery on the same page as jQuery.
    (http://learn.jquery.com/using-jquery...her-libraries/)
    Well, theoretically it also works with multiple versions of jQuery because the principle is the same. However, noconflict should really only be the very last resort if nothing else is possible (e. g. if you don’t have control over other scripts that might be included in a document). Unfortunately many people think it solves all their problems.


  •  

    Posting Permissions

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