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
    Regular Coder
    Join Date
    Aug 2002
    Location
    San Francisco
    Posts
    455
    Thanks
    19
    Thanked 15 Times in 15 Posts

    Script functions until I add doctype

    I have a script that I got from W3Schoolsh that lets me show/hide my menu. It works fine until I add the doctype, then it ceases to function. I realize I could redo it with jQuery, but I'm more interested in WHY the addition of a doctype would cause it to stop working. Here is the code:

    Code:
    <script type="text/javascript">
    var i = -135;
    var c = 0;
    var intHide;
    var navSpeed = 5;
    
    function choosePic() {
    	if (window.innerWidth < 600) {
    		document.getElementById('nav').onclick = showHideNav;
    		document.getElementById("logo").src = "images/grot_white.png";	
    		document.getElementById("tagline").src = "images/tagline_phone.png";	
    		document.body.style.backgroundColor = "#194964";
    	}
    }
    
    function showHideNav() {
    	if (c == 0) {
    		c = 1;
    		clearInterval(intHide);
    		intShow = setInterval("showNav()",10);
    	}
    	else {
    		c = 0;
    		clearInterval(intShow);
    		intHide = setInterval("hideNav()",10);
    	}
    }
    function showNav() {
    	if (i < -12) {
    		i = i + navSpeed;
    		document.getElementById('nav').style.left=i;
    	}
    }
    function hideNav() {
    	if (i > -150) {
    		i = i - navSpeed;
    		document.getElementById('nav').style.left=i;
    	}
    }
    </script>
    The original script had a simple <html> and no doctype.
    Outside of a dog, a book is man's best friend. Inside of a dog it's too dark to read. Groucho Marx

  • #2
    Regular Coder nomanic's Avatar
    Join Date
    Feb 2009
    Location
    United Kingdom
    Posts
    255
    Thanks
    9
    Thanked 33 Times in 33 Posts
    I've had this before too
    Mine worked with certain doctypes but not others
    I'm curious about the answer also
    <DmncAtrny> I will write on a huge cement block "BY ACCEPTING THIS BRICK THROUGH YOUR WINDOW, YOU ACCEPT IT AS IS AND AGREE TO MY DISCLAIMER OF ALL WARRANTIES, EXPRESS OR IMPLIED, AS WELL AS DISCLAIMERS OF ALL LIABILITY, DIRECT, INDIRECT, CONSEQUENTIAL OR INCIDENTAL, THAT MAY ARISE FROM THE INSTALLATION OF THIS BRICK INTO YOUR BUILDING."
    <DmncAtrny> And then hurl it through the window of a Sony officer
    <DmncAtrny> and run like hell

    Portfolio, Tutorials - http://www.nomanic.biz/

  • #3
    Senior Coder
    Join Date
    Sep 2010
    Posts
    2,451
    Thanks
    17
    Thanked 275 Times in 275 Posts
    What is the doctype you added and what is the browser and operating system you are using? Those are majorly important questions.

  • #4
    Regular Coder
    Join Date
    Mar 2006
    Posts
    728
    Thanks
    35
    Thanked 132 Times in 123 Posts
    This line shouldn't do anything, without units a style left is meaningless:

    document.getElementById('nav').style.left=i;

    Although maybe some browser with a quirky doctype would set the left to '0pt' as a default when given garbage in.
    Last edited by mrhoo; 07-13-2012 at 03:58 AM.

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,574
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    MSIE in "quirks mode" (which is usually what you get when you don't use a DOCTYPE) *does* support doing
    Code:
        document.getElementById('nav').style.left=i;
    without the "px", so I'd bet that she was using MSIE.

    MSIE 8 and 9, at the least, do pay attention to the DOCTYPE enough that indeed they need to see
    Code:
        document.getElementById('nav').style.left  = i + "px";
    Not sure about MSIE 7.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    mrhoo (07-14-2012)


  •  

    Posting Permissions

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