Jump to content

<!doctype> Problem


gongpex
 Share

Recommended Posts

Hello everyone, Yesterday I got javascript code from w3schools DHTML, and this is the code:

<html><head><style>body{font-family:arial;}a{color:black;text-decoration:none;font:bold}a:hover{color:#606060}td.menu{background:lightblue}table.nav{background:black;position:relative;font: bold 80% arial;top:0px;left:-135px;margin-left:3px;}</style><script type="text/javascript">var i=-135;var c=0;var intHide;var speed=3;function show_hide_menu(){if (c==0){c=1;clearInterval(intHide);intShow=setInterval("show()",10);}else{c=0;clearInterval(intShow);intHide=setInterval("hide()",10);}}function show(){if (i<-12){i=i+speed;document.getElementById('myMenu').style.left=i;}}function hide(){if (i>-135){i=i-speed;document.getElementById('myMenu').style.left=i;}}</script></head><body><table id="myMenu" class="nav" width="150" onclick="show_hide_menu()"><tr><td class="menu"><a href="/default.asp">HOME</a></td><td rowspan="5" align="center" bgcolor="#FF8080">M<br />E<br />N<br />U</td></tr><tr><td class="menu"><a href="/asp/default.asp">ASP</a></td></tr><tr><td class="menu"><a href="/js/default.asp">JavaScript</a></td></tr><tr><td class="menu"><a href="default.asp">DHTML</a></td></tr><tr><td class="menu"><a href="/vbscript/default.asp">VBScript</a></td></tr></table><p>Click on the MENU to show/hide the menu</p><p>Try changing the "speed" variable in the script, to change the menus's sliding speed</p></body></html>

This code was run successfully but when it pasted at the <!DOCTYPE>, like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Untitled Document</title> <style type="text/css">body{font-family:arial;}a{color:black;text-decoration:none;font:bold}a:hover{color:#606060}td.menu{background:lightblue} table.nav{background:black;position:relative;font: bold 80% arial;top:0px;left:-135px;}</style></head> <script type="text/javascript">var i=-135;var intHide;var speed=3;function showmenu(){clearInterval(intHide);intShow=setInterval("show()",10);}function hidemenu(){clearInterval(intShow);intHide=setInterval("hide()",10);}function show(){if (i<-12){i=i+speed;document.getElementById('myMenu').style.left=i;}}function hide(){if (i>-135){i=i-speed;document.getElementById('myMenu').style.left=i;}}</script> <body><table id="myMenu" class="nav" width="150" onMouseOver="showmenu()" onMouseOut="hidemenu()"><tr><td class="menu"><a href="/default.asp">HOME</a></td><td rowspan="5" align="center" bgcolor="#FF8080">M<br />E<br />N<br />U</td></tr><tr><td class="menu"><a href="/asp/default.asp">ASP</a></td></tr><tr><td class="menu"><a href="/js/default.asp">JavaScript</a></td></tr><tr><td class="menu"><a href="default.asp">DHTML</a></td></tr><tr><td class="menu"><a href="/vbscript/default.asp">VBScript</a></td></tr></table><p>Mouse over the MENU to show/hide the menu</p><p>Try changing the "speed" variable in the script, to change the menus's sliding speed</p></body></html>

the code cannot run, why it can be such? please explain to me thank you

  • Like 1
Link to comment
Share on other sites

That's because when the browser detects a DOCTYPE is expects you to code properly. It won't fix your mistakes for you anymore. Values in CSS require units. If you don't specify units, the browser doesn't know if you mean pixels, centimeters or inches. (In quirksmode it assumes pixels but that's non-standard) document.getElementById('myMenu').style.left=i + "px";

Link to comment
Share on other sites

That's because when the browser detects a DOCTYPE is expects you to code properly. It won't fix your mistakes for you anymore. Values in CSS require units. If you don't specify units, the browser doesn't know if you mean pixels, centimeters or inches. (In quirksmode it assumes pixels but that's non-standard) document.getElementById('myMenu').style.left=i + "px";
you right, thank you , by the way :
<!--[if IE 6]>Special instructions for IE 6 here<![endif]-->

this just command taqs or have function? because if the code or taqs like this:

<!--taqs-->

it can disable script, so, are both same? please tell me, thank's for response

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...