<script language="javascript">
var selectEl = null; // keep track of currently selected
function mo(el) {
if (selectEl) { // unselect selected
selectEl.style.backgroundColor = 'gray';
selectEl.style.border = '0px inset black';
}
selectEl = el; // new selected
el.style.backgroundColor = 'navy';
}
</script>
After Completion of writing the script function design the table or div with your elements after that give call the JavaScript function for whatever the elements you need to select
On each link write this function like this
<td>
<a href="index.html"onclick="mo(this)">Products</a>
</td>
I hope it helps you happy coding
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
|
|||
6 comments :
I hope this will me. i will check it tomorrow . Thank u
how to menu bar use.. Eg(File-->open click means open some file) how to use this in use coding and design..after how to write coding in radio button and dropdownlist..
Dear frnd this code will not work
as on click it will navigate you on next page
. on navigation it will refreshs the whole page
hi bro . it's really helping but i also want to change the text color with background color after selection the tab..
Hello sir
I am using a master page containing the following menu
< div class="clear hideSkiplink">
< asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false"
IncludeStyleBlock="false" Orientation="Horizontal">
< Items>
< asp:MenuItem NavigateUrl="~/Index.aspx" Text="HOME" />
< asp:MenuItem NavigateUrl="~/Master.aspx" Text="MASTER" />
< asp:MenuItem NavigateUrl="~/About.aspx" Text="ABOUT" />
< /asp:Menu>
< /div>
with the following css
.clear
{
clear: both;
}
div.hideSkiplink
{
border-bottom:2px solid #e6e6e6;
width:100%;
}
div.menu
{
font-size: 17px;
height:35px;
padding-left:10px;
}
div.menu ul
{
list-style-type: none;
height: auto;
padding:0px;
margin: 0px;
}
div.menu ul li
{
display: inline;
margin:0px 8px 0px 8px;
}
div.menu ul li a
{
text-decoration: none;
color: #222222;
line-height: 1.35em;
padding: 4px 24px;
display:block;
}
div.menu ul li a:hover
{
color: #d30545;
line-height: 1.35em;
border-left:1px solid #e6e6e6;
border-right:1px solid #e6e6e6;
border-top:1px solid #e6e6e6;
box-shadow:0px -1px 3px #777777;
-webkit-transition: color .3s linear;
-moz-transition: color .3s linear;
}
I want to make my active menu lie the following
http://img593.imageshack.us/img593/1476/woe3.jpg
hi... i need the menu like http://allage.in/ this page.... i want the solution for this.
Note: Only a member of this blog may post a comment.