Scroling Menu

Demo

• HTML
• Vb.Net

Step 1: Insert the following style sheet to the HEAD section of your page:

<style type="text/css"> * { margin: 0px; padding: 0px; } #menu{ width: 350px; height: 65px; margin: 0 auto; background-color:#000; } #menu_bg{ height: 82px; /*background: url(images/menu_bg.jpg); background-repeat:repeat-x;*/ background-position:top; } #menu ul { list-style: none; padding-top: 4px; /*padding-left: 55px;*/ } #menu li { display: inline; } #menu a { font-family: Georgia, "Times New Roman", Times, serif; text-align: center; text-decoration: none; color: #ffffff; font-weight: normal; font-size: 16px; float:left; width: 174px; height: 42px; display: block; padding-top: 20px; } #menu a:hover{ width: 174px; height: 42px; background: url(menu_hov.png); font-weight:bold; color: #F00; } .menulines a{ text-decoration:none; color:#F00; } .menulines:hover{ background-color:#000; } </style>

Step 2: Add the below HTML  to the body of your page.

<marquee direction="left" behavior="alternate" scrollamount="5"> <div id="menu_bg"> <div id="menu"> <ul> <li><a href="http://cybersorce.blogspot.in/p/eewfewf.html" title="" style="border-right: 1px solid #ffffff; color: #F00;">HTML</a></li> <li><a href="http://cybersorce.blogspot.in/p/vbnet.html" title="" style="color: #F00;">Vb.Net</a></li> </ul> </div> </div> </marquee>

Step 3: Download Folowing Image and save it into same Folder.

1.Right Click on the image

2.Save Image As....

 

You can have multiple menus on the same page.