Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Senior Member
    Join Date
    Mar 2010
    Posts
    104
    Member #
    21316
    Liked
    1 times
    Hi,

    Okay, I'm not very good with Javascript, so I seriously need help here. I'm sick of these javascripts conflicting making other javascripts not work.

    I've got 3 javascripts on my website:
    1) Digital Clock
    2) Date Picker
    3) and a Toggle Hide Show content effect javascript.

    Without the toggle script, the digital clock and date picker work just fine!
    When I add the Toggle script ... both the digital clock and date picker doesn't work!

    I've read about No.conflict but I have no idea what they are talking about... maybe its something less complicated?

    Here is my Javascript codes:

    Code:
    <link rel="stylesheet" href="datepicker/development-bundle/themes/base/jquery.ui.all.css">
        <script src="datepicker/development-bundle/jquery-1.5.1.js"></script>
        <script src="datepicker/development-bundle/ui/jquery.ui.core.js"></script>
        <script src="datepicker/development-bundle/ui/jquery.ui.widget.js"></script>
        <script src="datepicker/development-bundle/ui/jquery.ui.datepicker.js"></script>
        <link rel="stylesheet" href="datepicker/development-bundle/demos/demos.css">
        <script>
        $(function() {
            $( "#datepicker, #datepicker2, #datepicker3, #datepicker4, #datepicker5, #datepicker6, #datepicker7, #datepicker8, #datepicker9, #datepicker10, #datepicker11, #datepicker12" ).datepicker({
                numberOfMonths: 3,
                showButtonPanel: true
            });
        });
        </script>
    
        <script src="jquery.MyDigitclock.js"></script>
    
    <script>
    $(function(){
                $("#clock1").MyDigitClock();
                $("#clock2").MyDigitClock({
                    fontSize:50,
                    fontFamily:"Arial",
                    fontColor: "#000",
                    fontWeight:"bold",
                    bAmPm:true,
                    background:'#fff',
                    bShowHeartBeat:true
                    });
                $("#clock3").MyDigitClock({
                    fontSize:150,
                    fontColor:"grey",
                    background:"#fff",
                    fontWeight:"bold",
                    timeFormat: '{HH}<span id="ch1">:</span>{MM}'}
                );
            });
    function MM_openBrWindow(theURL,winName,features) { //v2.0
      window.open(theURL,winName,features);
    }
    </script>
    
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    
        $(".toggle_container").hide();
    
        $("h2.trigger").click(function(){
            $(this).toggleClass("active").next().slideToggle("slow");
        });
    
    });
    </script>
    This line seems to be the problem:

    Code:
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    Please, if you could me - I'd appreciate it! Thanks

  2.  

  3. #2
    Member
    Join Date
    May 2011
    Location
    Baltimore, MD
    Posts
    60
    Member #
    27796
    Liked
    11 times
    You are absolutely right.

    All you need to do is remove that line of code and you should be good to go.

    What's happening is that you area already importing your jQuery libraries via:
    HTML Code:
    <script src="datepicker/development-bundle/jquery-1.5.1.js"></script>
    So the line of code you highlighted is trying to get the same objects, maybe just a little more updated. Two of the same libraries = conflict. Remove one or the other, and you should be good to go.

    reflex84 likes this.
    /phillihp/
    Check out my blog @ http://www.phillihp.com
    ~Web~Mobile~Hacking~Tech~Gadgets~More~

  4. #3
    Senior Member
    Join Date
    Mar 2010
    Posts
    104
    Member #
    21316
    Liked
    1 times
    Alright, that worked!!! What would I do without you guys!! Legends!
    Ok so you only need 1 jQuery library which will work all 3 javascripts? What is in this jQuery library? Is it just coding that makes all javascripts work?

    Thanks

  5. #4
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,483
    Member #
    425
    Liked
    2783 times
    Javascripts will "work", unless they require jQuery, regardless of which library is imported. jQuery is nothing more than a framework for Javascript designed to make coding easier. The oversimplified, generalized explanation is that Javascript itself is nothing more than a scripting language designed to add interactivity to web pages within a browser without having to reload pages (if enabled), and jQuery is designed to make it easier to build that level of interactivity in.

    That means that what's in that jQuery library is a bunch of built-in functions and code and other things designed to take something that would require 10, 20, 30, maybe 40 lines to code and bring it down to a couple of lines. But when you call multiple libraries of the same type (e.g. multiple jQuery version libraries), functions and other aspects of the framework tend to change and code evolves, which means the browser gets "confused" as to what which library to use and which function. Annnnnnnnnnd there's your conflict.

    You can have multiple libraries of different types, as long as those libraries don't conflict with one another (e.g. the jQuery version library and say a jQuery library that does a slider effect). But it's not Noah's Ark...you can only have one of the same animal.
    reflex84 likes this.
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)

  6. #5
    Senior Member
    Join Date
    Mar 2010
    Posts
    104
    Member #
    21316
    Liked
    1 times
    Excellent Explanation!! Really appreciate the time and effort you guys have for other people's problems!


Remove Ads

Posting Permissions

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

Search tags for this page

javascript clock conflict javascript reload page

Click on a term to search for related topics.
All times are GMT -6. The time now is 05:17 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com