Script functions until I add doctype

marilynn.fowler

07-13-2012, 01:35 AM

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:

<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.

nomanic

07-13-2012, 01:38 AM

I've had this before too
Mine worked with certain doctypes but not others
I'm curious about the answer also

DrDOS

07-13-2012, 02:44 AM

What is the doctype you added and what is the browser and operating system you are using? Those are majorly important questions.

mrhoo

07-13-2012, 02:53 AM

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.

Old Pedant

07-13-2012, 09:18 PM

MSIE in "quirks mode" (which is usually what you get when you don't use a DOCTYPE) *does* support doing

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

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

Not sure about MSIE 7.