Posts

Showing posts from May, 2014

Change Css Class of li in ul onclick - Menu Linked Pages

Below code is posted on this blog on demand. This topic is modification of the topic Change Css Class of li in ul onclick Previous code sample is single page code. Now I have three different pages that are linked to three menu items. When Page One is clicked then menu Page One is highlighted and menupageone.html is navigated, when Page Two is clicked then menu Page Two is highlighted and menupagetwo.html and soon. menupageone.html – code , copy paste the below code and save with name menupageone.html <! 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=iso-8859-1" />     < title > List Item Menu - Query String </ title >     < style type ="text/css">         *
Post a Comment
Read more

Change Css Class of li in ul onclick with Query String

Copy and paste and run the code. <! 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=iso-8859-1" /> < title > List Item Menu - Query String </ title > < style type ="text/css"> ul {        list-style-type : none ;        float : left ;        border-bottom : solid 2px Red ;        padding-right : 40px ; } ul li {        float : left ;        width : auto ;          cursor : pointer ; } ul li a {        text-decoration : none ;        color : #000000 ;        padding : 8px ;        display : block ; } </ style > < script type ="text/javascript" language ="javascript">        function chec
2 comments
Read more

Change Css Class of li in ul onclick with Anchor Tag

Below code is some modification as on demand of one of the reader for topic Change Css Class of li in ul onclick <!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=iso-8859-1" /> <title>List Item</title> <style type="text/css"> ul { list-style-type:none; float:left; border-bottom: solid 2px Red; padding-right:40px; } ul li { float:left; width:auto; cursor:pointer; } ul li a { text-decoration:none; color:#000000; padding:8px; display:block; } </style> <script type="text/javascript" language="javascript"> function checklist(ctrl) { var list = document.getElementById("menu").getElementsByTagName('li'); for(
Post a Comment
Read more