PDA

Click to See Complete Forum and Search --> : Navigation not working

deviled egg
04-23-2008, 09:00 PM
Can anyone offer some advice/suggestions as to why my navigation is working in firefox or IE? The home buttom and the contact button work, but the other 4 navs are no bueno. please veiw the site at: http://dev.threeduck.com/riskassessment/index.php

and here is the code I am having issues with:

<!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=UTF-8" />
<title>Pre Employment Verification Services</title>

<link rel="stylesheet" rev="stylesheet" href="css/rag_stylesheet.css" type="text/css" media="screen" charset="utf-8" />


<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body>

<!--start container div tag -->

<body onload="MM_preloadImages('images/rag_bttn1_ovr.jpg','images/rag_bttn2_ovr.jpg','images/rag_bttn3_ovr.jpg','images/rag_bttn4_ovr.jpg','images/rag_bttn5_ovr.jpg','images/rag_bttn6_ovr.jpg')">
<div id="container"> <!--<div align="center"> -->

<!--start header div tag -->
<div id="header">
<img src="images/rag_title.jpg" alt=" pre verification of employment" width="935" height="160" border="0" />

<!--start upper-nav div tag -->
<div id="upper-nav">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="9%" align="left" valign="top"><img src="images/rag_lft_spcr.jpg" width="140" height="32" /></td>
<td width="4%" align="left" valign="top"><a href="index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/rag_bttn1_ovr.jpg',1)"><img src="images/rag_bttn1.jpg" name="Image2" width="60" height="32" border="0" id="Image2" /></a></td>
<td width="7%" align="left" valign="top"><a href="services.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/rag_bttn2_ovr.jpg',1)"><img src="images/rag_bttn2.jpg" name="Image3" width="115" height="32" border="0" id="Image3" /></a></td>
<td width="10%" align="left" valign="top"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images/rag_bttn3_ovr.jpg',1)"><img src="images/rag_bttn3.jpg" name="Image4" width="147" height="32" border="0" id="Image4" /></a></td>
<td width="33%" align="left" valign="top"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/rag_bttn4_ovr.jpg',1)"><img src="images/rag_bttn4.jpg" name="Image5" width="103" height="32" border="0" id="Image5" /></a></td>
<td width="12%" align="left" valign="top"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/rag_bttn5_ovr.jpg',1)"><img src="images/rag_bttn5.jpg" name="Image6" width="154" height="32" border="0" id="Image6" /></a></td>
<td width="12%" align="left" valign="top"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','images/rag_bttn6_ovr.jpg',1)"><img src="images/rag_bttn6.jpg" name="Image7" width="84" height="32" border="0" id="Image7" /></a></td>
<td width="13%" align="left" valign="top"><img src="images/rag_rt_spcr.jpg" width="132" height="32" /></td>
</tr>
</table>

<!--end upper-nav div tag -->
</div>

<!--end header div tag -->
</div>
Starseedpyxis
04-23-2008, 11:06 PM
Your navigation is not working because you are putting <div> tags inside of table cells <td>, which is causing one of your central div areas to raise in height, actually 'blocking' the navigation (invisibly). Basically it is just causing weird problems. You should not put divs inside of tables, however of course you can use tables inside of divs.

To diagnose problems like this it is always good to validate your code - often it is syntax or standards errors like this. Validation will call attention to either typos, 'obsolete' tags, and non-standards compliant code. You can validate using programs like Dreamweaver, or you can download a great tool for Firefox called Web Developer https://addons.mozilla.org/en-US/firefox/addon/60. This tool does a lot of amazing things, download it and play around.

Good luck!
deviled egg
04-23-2008, 11:56 PM
so the div tags in the table below the nav are what's causing the error? Because there are no div tags in my table with the nav
Drazan
04-24-2008, 12:16 AM
That is one of the most convoluted ways of doing a hover button.

Css is simpler and easier to code and actualy view what the hecks going on. Rather than dealing with a wysiwyg editor - trying to do the work for you. Not saying editors are all bad, but even to an experienced coder the default code plopped in can leave a person pulling their hair.

Here's a sample of a CSS button that I use. (this is off the top of my head - so may need a tweak here and there).


/* CSS */

.button_home {
background-image: url(/images/home.jpg);
width: 120px;
height: 30px;
}
.button_home a:hover {
background-image: url(/images/home_hover.jpg);
width: 120px;
height: 30px;
}

In page

<div class="button_home"><a herf="/index.html"><img src="/images/trans.gif" border="0" height="30" width="120" alt="home button"></div>

If you want them horizontal - something like this.

/* CSS */

.button_home {
background-image: url(/images/home.jpg);
width: 120px;
height: 30px;
float: left;
padding: 0px 3px 0px 3px;
}
.button_home a:hover {
background-image: url(/images/home_hover.jpg);
width: 120px;
height: 30px;
float: left;
padding: 0px 3px 0px 3px;
}

May need to tweak a couple things for your layout, but that's how I've done regular mouse over buttons for years.

I avoid any type of javascript unless I'm doing drop down menus or slide outs. Even then there are ways to do css menus.

Jade
deviled egg
04-24-2008, 06:10 PM
My nav still won't rollover or even work at ths point! http://192.168.0.3/riskassessment/_index.html
I am so sad and frustrated. :mad:
deviled egg
04-24-2008, 06:11 PM
and I'm only 1 post away from 100
D-Frag
04-24-2008, 07:16 PM
i agree with Drazan, you really need to try and step away from Dreamweaver. I picked this book up click here (http://www.buy.com/retail/Product.asp?sku=31002794&SearchEngine=CJdealsden&Type=CJ&Keyword=31002794&adid=17662) and it has helped out tremendously. And this is coming from someone who knew nothing about HTML or CSS. Once you get about 5-8 chapters in you will start asking yourself why you dont just hand code everything. Also the validator tool at W3 is very useful.
deviled egg
04-24-2008, 08:10 PM
Thanks D-Frag! (I got the nav to work using Drazan's code, sort of.) I had to make some changes to it, and I'm still messing with the rollover aspect, but it works!

So does this now mean that inaddtion to dancing cirles around me in Illy, you can out code me too!? Man, one of these days I'll catch up! (Or get better than you! :p) LOL!! Did you get my evite for my b-day party? It's this weekend, (but I'm sure you have plans to rock it at some hot party that you'll be djing.) We should hang sometime though!:D

Woo-hoo! 100 posts!!
D-Frag
04-24-2008, 08:31 PM
nah never got an evite, but you are right i will be busy this weekend (my bud from CO is in town for a couple nights) so we are going to be hanging out and hes playing a big show at Homme Lounge. anyways HAPPY BIRTHDAY!!!!

as for the coding, im not all that good yet, still learning. although I do think i have flash under control, now i just gotta learn actionscript 3.0 (which is freaking hard) and javascript, once i get some books on those i should be on my way to a web designer (officially) hope you have a good birthday yo!