Michael is correct. I only used another menu, made it always visible and placed it in the table. You can get that tab look by either using images or by using css in the menu and in the table the menu is in.
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>The WYNIWYG - What You Need Is What You Get !!!</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<STYLE type=text/css>BODY {
FONT-SIZE: 12px; FONT-FAMILY: verdana; BACKGROUND-COLOR: #ffffff;margin:5px;
}
.backG {
FONT-SIZE: 12px; COLOR: #ffffff; BORDER-BOTTOM: #538c4d 2px solid; FONT-FAMILY: verdana; BACKGROUND-COLOR: #93c39b
}
TD.form1 {
FONT-SIZE: 12px; BACKGROUND: #eaeaea; FONT-FAMILY: verdana
}
.bord{border-top:1px solid #000000;border-right:1px solid #000000;
border-bottom:0px;border-left:1px solid #000000;
}
.menutable{border-top:0px solid #000000;border-right:0px solid #000000;border-bottom:1px solid #000000;border-left:0px solid #000000;
margin-top:0px;margin-right:0px;margin-bottom:5px;margin-left:0px;
</STYLE>
<!--*********SEE TWO NOTES BELOW ABOUT CLASS USED FOR MENU AND FOR TABLE MENU IS IN!**********-->
<!--NOTE: *************************.bord is the class used for putting the border around the top,
right and left of the menu items and preventing a bottom border around each item*********-->
<!--NOTE: ********* .menutable is the class applied in the table to put a full black bottom border
that looks as if it is at the bottom of the menu. It actually is a border at the bottom of the table.
This class is applied in the table cell, the td, where the menu is put.****************-->
<!--*********************************************************************************************-->
<META content="MSHTML 5.50.4807.2300" name=GENERATOR></HEAD>
<BODY><!-- ***** This is the section of code you need to paste into your web pages ***** -->
<SCRIPT src="milonic_src.js" type=text/javascript></SCRIPT>
<NOSCRIPT><A href="https://milonic.com/">JavaScript Menus and DHTML Menus
Powered by Milonic</A></NOSCRIPT>
<SCRIPT type=text/javascript>
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=mmenuns4.js><\/scr"+"ipt>");
else _d.write("<scr"+"ipt type=text/javascript src=mmenudom.js><\/scr"+"ipt>");
</SCRIPT>
<SCRIPT src="menu_data_test.js" type=text/javascript></SCRIPT>
<!-- **** JavaScript Menu HTML Code --><!-- This is the table for the header that contains the company logo and the letter-head google ad -->
<TABLE height="20%" cellSpacing=2 cellPadding=2 width="100%" bgColor=#000000 border=1>
<TBODY>
<TR vAlign=top>
<TD align=middle><FONT color=#ffffff>Company Logo Image</FONT> </TD></TR>
<TR vAlign=top>
<TD> </TD></TR></TBODY></TABLE><br>
<table width="100%" cellpadding=0 cellspacing=1 border=0 align="center">
<tr>
<td class="menutable">
<script>
with(new menuname("Country")){
alwaysvisible=1;
style=tableStyle;
orientation="horizontal";
menuwidth="100%";
itemwidth="100%";
menualign="center";
position="relative";
aI("text=USA;url=whatever;");
aI("text=Great Britian;url=whatever;");
aI("text=New Zealand;url=whatever;");
aI("text=Australia;url=whatever;");
aI("text=Russia;url=whatever;");
aI("text=Brazil;url=whatever;");
aI("text=Germany;url=whatever;");
aI("text=Italy;url=whatever;");
aI("text=Spain;url=whatever;");
aI("text=Country;url=whatever;");
}
drawMenus();
</script>
</td>
</tr>
</table>
<div style="height:2px;padding:0px;margin:0px"><img src="blank.gif" width="1" height="3" border="0"></div>
<DIV>
<TABLE height="75%" cellSpacing=2 cellPadding=2 width="100%" bgColor=#000000
border=1>
<TBODY>
<TR vAlign=top>
<TD id=leftpanel><div style="height:75%;width:150px;border:1px solid red"> </div>
</TD>
<TD id=maincanvas width="75%" height="100%">
<TABLE id=maincanvastable height="100%" width="100%" border=1>
<TBODY>
<TR id=top height="50%" width="100%">
<TD colSpan=2><FONT color=#ffffff>Under Construction<BR>A Utopia
for anyone looking to explore Indian culture, food, cinema, her
pristine natural beauty, among other things !!! </FONT></TD></TR>
<TR id=mid height="40%">
<TD id=mid_ad width="30%">Ad goes here </TD>
<TD id=mid_content width="70%">Middle content goes here. </TD></TR>
<TR id=bottom height="10%">
<TD colSpan=2>Bottom content goes here </TD></TR></TBODY></TABLE></TD>
<TD id=rightpanel width="15%" height="100%"> Possible place for
advert </TD></TR></TBODY></TABLE></DIV></FONT><BR>
<DIV>
<TABLE height="5%" cellSpacing=2 cellPadding=2 width="100%" bgColor=#000000
border=1>
<TBODY>
<TR vAlign=top>
<TD align=left width="20%"> <FONT face=Arial color=#000000
size=-2><A href="https://milonic.com/">Drop Down Menu by
Milonic</A></FONT> </TD>
<TD align=right width="90%"><FONT face=Arial color=#ffffff>Contact Us |
About Us </FONT></TD></TR></TBODY></TABLE></DIV></FONT>
<DIV></DIV></FONT>
<DIV></DIV></BODY></HTML>
Code: Select all
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
with(menuStyle=new mm_style()){
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#515151";
onbgcolor="#4F8EB6";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="arrow.gif";
subimagepadding=2;
}
with(tableStyle=new mm_style()){
bordercolor="#CCCCCC";
borderstyle="outset";
borderwidth=0;
offclass="bord";
onclass="bord";
//offborder="1px solid #000000";
//onborder="1px solid #000000";
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#CCCCCC";
offcolor="#000000";
onbgcolor="#ffffff";
oncolor="#cccccc";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="transparent";
separatorsize=3;
separatorheight="100%";
separatorwidth=2;
separatoralign="center";
separatorpadding=0;
menubgcolor="transparent";
subimage="arrow.gif";
subimagepadding=2;
}
with(new menuname("Main Menu")){
alwaysvisible=1;
style=menuStyle;
top="220";
left="20";
followscroll = "5,10,4";
aI("status=Home;text=Home;url=http://home.comcast.net/~worldinpocket/index.html;");
aI("showmenu=Movies;text=Movies;");
aI("showmenu=Music;text=Music;");
aI("showmenu=Travel n Tourism;text=Travel n Tourism;");
aI("showmenu=Sports;text=Sports;");
aI("showmenu=Education;text=Education;");
}
with(milonic=new menuname("Movies")){
overflow="scroll";
style=menuStyle;
aI("text=History Of Indian Cinema;url=http://worldinpocket.home.comcast.net/india/movies/movies-history.html;")
aI("text=Stars Of Today;url=http://worldinpocket.home.comcast.net/india/movies/movies-starstoday.html;")
aI("text=Stars oI Yester Years;url=http://worldinpocket.home.comcast.net/india/movies/movies-starsyester.html;")
aI("text=Movies In The Theater;url=http://worldinpocket.home.comcast.net/india/movies/movies-theater.html;")
aI("text=In The Wings;url=http://worldinpocket.home.comcast.net/india/movies/movies-inthewings.html;")
}
with(milonic=new menuname("Music")){
style=menuStyle;
aI("text=History Of Indian Music;url=http://worldinpocket.home.comcast.net/india/movies/music-history.html;")
aI("text=Stars Of Today;url=http://http://worldinpocket.home.comcast.net/india/music/movies-starstoday.html;");
aI("text=Stars Of Yester Years;url=http://worldinpocket.home.comcast.net/india/music/movies-starsyester.html;");
aI("text=Bengali Music;url=http://worldinpocket.home.comcast.net/india/music/music-bengali.html;");
aI("text=Hindi Music;url=http://worldinpocket.home.comcast.net/india/music/music-hindi.html;");
aI("text=Online Music;url=http://worldinpocket.home.comcast.net/india/music/movies-starstoday.html;");
}
with(milonic=new menuname("Travel n Tourism")){
style=menuStyle;
aI("status=Places Of Interest in India;text=Places of Interest;url=http://home.comcast.net/~worldinpocket/india/travel/travel-interest.html;");
aI("text=Map Of India;url=http://worldinpocket.home.comcast.net/india/travel/travel-map.html;");
aI("text=Travel Agencies;url=http://worldinpocket.home.comcast.net/india/travel/travel-agencies.html;");
aI("text=How To Get To;url=http://worldinpocket.home.comcast.net/india/travel/travel-howtogetto.html;");
aI("text=Hotels;url=http://worldinpocket.home.comcast.net/india/travel/travel-hotels.html;");
}
with(milonic=new menuname("Sports")){
style=menuStyle;
aI("status=Indian Cricket;text=Cricket ;url=http://worldinpocket.home.comcast.net/india/sports/sports-cricket.html;");
aI("status=Indian Football;text=Football;url=http://worldinpocket.home.comcast.net/india/sports/sports-football.html;");
aI("status=Indian Hockey;text=Hockey;url=http://worldinpocket.home.comcast.net/india/sports/sports-hockey.html;");
}
drawMenus();You cannot get it to automatically wrap if it's wider than the rest of the tables it will just expand, however you can use divides but that will actually divide it in half, so if you have 11 items it will put 6 on the top row and 5 on the bottom and the menu will become smaller in width until you have enough items to have it expand the 100% again.
The other option is when you reach the limit of the width, to make a second table below the menu table, make it exactly the same and start a new menu.
You really need to take a look at the beginners' guide section, and particularly at the properties. There are 3 types, style properties which go in the menuStyle section, menu properties which go in the menu in the same area where you have style=; alwaysvisible= etc. and then item proeprties which go in each item.
Please look at the head of the page at the notes I place surrounded by the ****** which talk about the css. Also note in the menu data where I have used onclass= and offclass= that is applying the css I created for the borders of items to that table menu for the tab look.
I have to assume you are using the unlicensed version to develop the site. Since this is a commercial site [given you have a company logo listed] you will have to purchase a license. Milonic is very reasonably priced for the great menu you get.
Ruth