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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jul 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Two jQuery scripts doesn't work together

    Hello,

    I'm trying to combine two different jQuery scripts on my webpage. The one is showing flashvideos in a lightbox and the other one is displaying thumbnails in a slideshow.

    The problem is that only one script is working. I have searched the web and forums and found that several people have had this problem before and I have truly tried to fix it with noConflict(). The problem is that I have very little experience in Javascript so I haven't got it working.

    So, here are the lines in the code:

    <!-- Video lightbox -->
    <script type="text/javascript" src="/js/videolightbox/mootools.js"></script>
    <script type="text/javascript" src="/js/videolightbox/swfobject.js"></script>
    <script type="text/javascript" src="/js/videolightbox/videobox.js"></script>

    <!-- Thumbnail slider -->
    <script type="text/javascript" src="/js/jquery-1.2.6.js"></script>
    <script type="text/javascript" src="/js/carousel.js"></script>


    I haven't coded any of these myself (of course), so I am not familiar with the variables in the files. So my target is to find a way to to use these scripts simultaneously.

    I am very thankful for your help but I am also kindly asking for a simple and easy to understand instruction.

    The webpage can be found here: http://wearethemusicmakers.se/index2.php

    Best Regards
    Johannes

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,151
    Thanks
    203
    Thanked 2,548 Times in 2,526 Posts
    You are using two different frameworks - mootools and jQuery. That is almost certain to result in conflicts.

    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

  • #3
    New to the CF scene
    Join Date
    Jul 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok, I have now found a jQuery script for the lightbox so the header now looks like this:

    ----

    <!-- Thumbnail slider -->
    <script type="text/javascript" src="/js/jquery-1.2.6.js"></script>
    <script type="text/javascript" src="/js/carousel.js"></script>

    <!-- Video lightbox -->
    <script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript" charset="utf-8">
    google.load("jquery", "1.3");
    </script>
    <script type="text/javascript" src="/js/jquery.prettyPhoto.js"></script>

    ---


    So now the lower script works and if I delete that one the upper one kicks in.

    Any ideas of how to solve it?

    Thanks

    //Johannes

  • #4
    Banned
    Join Date
    Jul 2010
    Posts
    66
    Thanks
    0
    Thanked 1 Time in 1 Post
    Hi MooTools is a perfectly solid and acceptable Javascript library and I'd recommend you Mixing the two is not a good idea to debug conflicts.

    Try to search some of the the methods to fix the issues

    some methods like jquery.noconflict();


    <html>
    <head>
    <script src="prototype.js"></script>
    <script src="jquery.js"></script>
    <script>
    jQuery.noConflict();
    // Use jQuery via jQuery(...)
    jQuery(document).ready(function(){
    jQuery("div").hide();
    });
    // Use Prototype with $(...), etc.
    $('someid').hide();
    </script>
    </head>
    <body></body>
    </html>

    Refer This site as well you will get some idea

    http://docs.jquery.com/Using_jQuery_...ther_Libraries


  •  

    Posting Permissions

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