vacuus
-
Posts
5 -
Joined
-
Last visited
vacuus's Achievements
Newbie (1/7)
0
Reputation
-
You'll have to use Javascript/Flash for the cycle. A Javascript function that checks the time, and then changes the source of your iframe could work - you wont get a fade effect though.
-
Hey again,After reading this brilliant turorial on howto create a drop down navigation bar in CSS, compatible with IE via a HTC extension, I went ahead and re-designed the navigation for my site...Now, it works perfectly in Firefox, however IE refuses to break the line when I hover my mouse over the menu.Here's the related CSS: body{ background-color: #000000; color: #FFFFFF; margin: 0px; padding: 0px; text-align: center; overflow: hidden;}#header { background: #000000; width: 100%; padding: 0px; /*border: 2px solid #FFFFFF;*/ margin-bottom: 25px;}#header ul { cursor: crosshair; width: 80%; display: block; margin: 0px 10% 0px 10%; padding: 0px; color: #FFFFFF; font-weight: bold; background-color: #111111; border-bottom: 2px solid #FFFFFF;}#header li { display: inline; margin: 0; padding: 0px 10px 0px 10px; color: #FFFFFF; font-weight: bold; position: relative; z-index: auto;}#header ul li.onleft:hover { background-color: #444444; border-right: 5px solid #FFFFFF;}#header ul li.onbottom:hover { background-color: #444444; border-bottom: 5px solid #FFFFFF;}#header ul li.center { font-size: xx-large;}#header ul li.onright:hover { background-color: #444444; border-left: 5px solid #FFFFFF;}#header ul ul{ display: none;}#header ul li:hover ul{ position: absolute; left: 0; width: 100%; height: 100%; z-index: 500; display: block; background-color: #444444; border: 1px solid #FFFFFF; font: normal normal bold 16px "Times New Roman", Arial;}#header a{ text-decoration: none;}#header a:hover{ text-decoration: underline;} And the Navigation: <link rel="stylesheet" href="./css/default.css" type="text/css" media="screen" /><link rel="stylesheet" href="./css/print.css" type="text/css" media="print" /><!--[if IE]><style type="text/css" media="screen">body {behavior: url(includes/iehover.htc);font-size: 100%;}#header ul li {width: 100%;}#header ul li a {height: 1%;} #header a {font: bold 0.7em/1.4em "Times New Roman", arial;}</style><![endif]--></head><body><div id="header"><ul><li class="onleft" id="menuHome">Home</li><li id="menuTitle" class="center">V-Ent.net<ul><li>The submenu!</li></ul></li><li class="onright" id="menuForum">Forum</li><br /><li class="onbottom" id="menuAbout">About</li><li class="onbottom" id="menuProjects">Projects</li><li class="onbottom" id="menuFaq">FAQ</li><li class="onbottom" id="menuContact" >Contact</li></ul></div> I'm still fiddling around with it ATM, but your help would be appreciated
-
I don't know, but maybe the customer testimonials on the right should be spaced a little from the menu bar?Maybe the small "valid xhtml" bar should have the same background colour as the copyright?Maybe the "current page" bar (above navigation) should be the same color as the logo, and perhaps slightly thinner?I doubt any of that is what you are after, however I kinda understand what you meant and thought I'ld throw some ideas around :)Good luck.
-
Found a quick second to change 'em over earlier, but it still didn't help :SI'm rather busy ATM, but I'll be sure to check out the link when I get the chance. Thanks for your help.
-
Hey all, first post here :)Anyway, I've been developing a new site, however have been having trouble getting the navigation going.I know, CSS does this as well, however IE doesn't seem to recognise it, so I thought I'ld go for java script: <div id="header"><ul><li class="onleft" onmouseover="whenHover('menuHome', 'onleft', 1);" onmouseout="whenDoneHover('menuHome', 'onleft', 1);" id="menuHome">Home</li><li onmouseover="whenHover('menuTitle', 'center', 1)" onmouseout="whenDoneHover('menuTitle', 'center', 1)" id="menuTitle" class="center">V-Ent.net<span id="menuTitlesub">The submenu!</span></li><li class="onright" onmouseover="whenHover('menuForum', 'onright', 1)" onmouseout="whenDoneHover('menuForum', 'onright', 1) "id="menuForum">Forum</li><br /><li class="onbottom" onmouseover="whenHover('menuAbout', 'onbottom', 1)" onmouseout="whenDoneHover('menuAbout', 'onbottom', 1) "id="menuAbout">About</li><li class="onbottom" onmouseover="whenHover('menuProjects', 'onbottom', 1)" onmouseout="whenDoneHover('menuProjects', 'onbottom', 1) "id="menuProjects">Projects</li><li class="onbottom" onmouseover="whenHover('menuFaq', 'onbottom', 1)" onmouseout="whenDoneHover('menuFaq', 'onbottom', 1)" id="menuFaq">FAQ</li><li class="onbottom" onmouseover="whenHover('menuContact', 'onbottom', 1)" onmouseout="whenDoneHover('menuContact', 'onbottom', 1)" id="menuContact" >Contact</li></div> And the script (Which I believe is the issue): function getElementByTagClass(tag, classN){ tags = getElementsByTagName(tag); for(i=0; i < tags.length; i++) { if(tags[i].className == classN) { return tags[i] } } return 0;}function showSub(id){ var d = document.getElementById(id+'sub'); d.style.display = "visible"; return false;}function hideSub(id){ var d = document.getElementById(id+'sub'); d.style.display = "none"; return false;}function whenHover(id, baseid, submenu=0){ var d = document.getElementById(id); if(baseid == 'onleft') { d.style.background-color = "#444444"; d.style.border-right = "5px solid #FFFFFF"; } if(baseid == 'onright') { d.style.background-color = "#444444"; d.style.border-left = "5px solid #FFFFFF"; } if(baseid == 'onbottom') { d.style.background-color = "#444444"; d.style.border-bottom = "5px solid #FFFFFF"; } if(submenu != 0) { showSub(id); } return false;}function whenDoneHover(id, submenu=0){ var d = document.getElementById(id); d.style.border-bottom = "2px solid #FFFFFF"; d.style.background-color = "#111111"; if(submenu != 0) { hideSub(id); } return false;} I'm thinking it's either the script, or the fact that I've defined #header ul/li..Still, I'ld appreciate your help, as I haven't done Javascript for a while...