SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Evangelist cturner01's Avatar
    Join Date
    Jun 2006
    Location
    My computer
    Posts
    408
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need JavaScript code to suit the two lots of css code - horizontal and vertical

    After realizing that htc files only work with Internet Explorer, I have needed to have JavaScript code to suit the two lots of css code below. Please help, I need the code pretty urgently. The code must work with most versions of browsers.

    The horizontal css code is here:
    Code CSS:
    #mainMenu {
    	list-style:none;
    	position:relative; 
    	z-index:10;
    	float:left;
    	width:100%;
    	/* fixed px height background == px fonts */
    	font:normal 14px/16px arial,helvetica,sans-serif;
    	background:url(images/roundedBorders.png) 0 0 no-repeat;
    }
     
    #mainMenu li {
    	position:relative;
    	float:left;
    	/*white-space:nowrap;*/
    }
     
    #mainMenu li a {
    	float:left;
    	padding:8px;
    	margin-left:12px;
    	text-decoration:none;
    	color:#FFF;
    	background:#39E url(images/roundedBorders.png) -12px 0 no-repeat;
    }
     
    #mainMenu li:hover a {
    	background-color:#13E;
    	background-position:-910px 0;
    }
     
    #mainMenu li ul {
    	list-style:none;
    	position:absolute;
    	display:inline; /* fix IE 'sticking' */
    	top:32px;
    	left:-999em;
    	width:216px;
    }
     
    #mainMenu li:hover ul {
    	display:block; /* fix IE 'sticking' */
    	left:0;
    }
     
    #mainMenu li:hover li {
    	width:216px;
    }
     
    #mainMenu li:hover li a {
    	float:none !important;
    	display:block;
    	zoom:1;
    	position:relative; /* make IE let you click whole thing */
    	background:#3A9CEE;
    }
     
    #mainMenu li li a:hover {
    	background:#0A2DE6;
    }

    The vertical css code is here:
    Code CSS:
    #sideMenu {
    	z-index: 10;
    	float:left;
    	width:232px;
    	padding:2px 0;
    	list-style:none;
    	/* image interaction == px fonts */
    	font:normal 14px/16px arial,helvetica,sans-serif;
    	background:#0b2ae7;
    }
     
    #sideMenu li {
    	position:relative;
    	float:left;
    	display:inline; /* prevent IE margin doubling */
    	width:216px;
    	margin-left:8px;
    }
     
    #sideMenu li li {
    	margin:0;
    }
     
    #sideMenu a {
    	display:block;
    	padding:27px 8px;
    	text-decoration:none;
    	color:#FFF;
    	background:#05C url('images/btnup.gif');
    }
     
    #sideMenu ul li a:hover {
    	display: block;
    	background: #1333E7 url('images/btndown.gif');
    }
     
    #sideMenu li ul {
    	z-index:10;
    	list-style:none;
    	position:absolute;
    	display:inline; /* prevent IE 'sticking */
    	top:0;
    	left:-999em;
    	background:#0b2ae7; /* 35F */
    	/*white-space:nowrap;*/
    }
     
    #sideMenu li:hover ul {
    	left:216px;	
    }
     
    #sideMenu li:hover li a {
    	padding:8px;
    }
     
    #sideMenu li ul a:hover { /* li li:hover a */
    	background:#0b2ae7;
    }

  2. #2
    SitePoint Evangelist cturner01's Avatar
    Join Date
    Jun 2006
    Location
    My computer
    Posts
    408
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Someone please help - this is urgent.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •