How to make a menu?

Chaosdruid · December 12, 2005

I've been using html for about a month now but I still can't seem to figure out how to add a menu on the left side of the page. But I still want to be able to write beside it. Please help me.

Bhushan · December 12, 2005

HI,Please look at the following code taken from the w3schools.com which would tell you how you can do this. You have to do it programatically. There is no tag as such to achieve this as far as my knowledge goes.Thnx,Bhushan.

<html><head><style>body{font-family:arial;}table{background:black;position:absolute;}a{color:black;text-decoration:none;font:bold}a:hover{color:#606060}td.menu{background:lightgreen}table.topnav{font-size:80%;top:0;left:0}table.menu{font-size:100%;bottom:0;z-index:-1}</style><script type="text/javascript">var i=0var c=0var intHidefunction show_hide_menu(){if (c==0)	{	clearInterval(intHide)	intShow=setInterval("show()",10)	c=1	}else	{	clearInterval(intShow)	intHide=setInterval("hide()",10)	c=0	}}function show(){if (i>-100)	{	i=i-1	document.all("menu").style.bottom=i	}}function hide(){if (i<0)	{	i=i+1	document.all("menu").style.bottom=i	}}</script></head><body><table class="topnav" width="150"><tr><td bgcolor="#FF0000" onclick="show_hide_menu()"><b>MENU</b><br /><table class="menu" id="menu" width="100%"><tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr><tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr><tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr><tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr><tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr></table></td></tr></table><p>Click on the MENU to see the menu options.</p></body></html>

I've been using html for about a month now but I still can't seem to figure out how to add a menu on the left side of the page. But I still want to be able to write beside it. Please help me.
<{POST_SNAPBACK}>

[edit]: wrapped code in codebox - skemcin

Kcarson · December 12, 2005

You can do this with tables (although not suggested) or with CSS div's. Here is an example, or if you want more information/explanation, check out this:http://www.w3schools.com/css/css_classification.asp specifically the example Creating a Homepage without Tables

<html><head><style type="text/css">div.container{width:100%;margin:0px;border:1px solid gray;line-height:150%;}div.header{padding:0.5em;color:white;background-color:gray;clear:left;}h1.header{padding:0;margin:0;}div.left{float:left;width:160px;margin:0;padding:1em;}div.content{margin-left:190px;border-left:1px solid gray;padding:1em;}</style></head><body><div class="container"><div class="header"><h1 class="header">W3Schools.com</h1></div><div class="left"><p>MENU will be placed here between this div</p></div><div class="content"><h2>Text goes here!</h2><p>Enter content of site here!!!!</p></div></div></body></html>

mani_ · December 13, 2005

You may have to change you file name from index.html to index.shtml then you can include your menu.html page in any file....if you dont want to change the extension of file then use the javascript...1. Create an external javascript file on notepad by typing..

document.write("<a href=your-location>Menu1</a><br>");document.write("<a href=your-location>Menu2</a><br>");document.write("<a href=your-location>Menu3</a><br>");document.write("<a href=your-location>Menu4</a><br>");

2. Now save it as your-file-name.js3. Include it in html page anywhere by typing

<script type=text/javascript src="your-file-name.js"></script>

That is a sample.. you can make changes to script.

Sign In

How to make a menu?

Recommended Posts

Chaosdruid

Link to comment

Share on other sites

Bhushan

Link to comment

Share on other sites

Kcarson

Link to comment

Share on other sites

mani_

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity