**UPDATE**
I would of just deleted the post but it wont let me so I will post my own answer.
After staring at my code forever I realized I had some lower case letters in CSS when the files had caps. So that was the issue.
I guess this is an issue on linux based servers which godaddy uses.
It wasn't an issue on my windows server.
So in case anyone runs into a similar problem. Here you go.
***********
Help! I haven't worked on websites in a long time. My wife asked me to make one for her small business. It was done and we were running it from a personal server. After hurricane Sandy we decided to go with a dedicated host.
We currently use godaddy for our dotcom so we just purchased a hosting plan as well.
I uploaded our working website from the personal server to godaddy's hosting site and now my rollovers don't work.
I have no clue how to even trouble shoot why they aren't working.
The only thing I can think of is its a CSS issue. But it was working before I uploaded it. It also works when I just view it on my computer.
So could it possibly be something on godaddys end? I called and asked and they just told me to go pack sand.
Basically I have five linked images that roll over. Three images link and two don't. One of the images, the home image, mouses over correctly. The other four do not.
Any help or advice would be greatly appreciated.
I'm not allowed to link to the website as a new user. So I guess I can send anyone interested in helping a private message.
But if you just search gemsdevine in google its on the first page.
Here is the code involved.
CSS
Code:
<style type="text/css">
html, body {
height:100%;
}
body {
margin-left:auto;
margin-right:auto;
height:100%;
width:100%;
position:relative;
font-family: Arial, Helvetica, sans-serif;
background-image: url(images/Canvas.jpg);
background-repeat: no-repeat;
background-size:100% 100%;
background-origin:content-box;
}
#GDV {
margin-left:auto;
margin-right:auto;
width:874px;
position:relative;
font-family: Arial, Helvetica, sans-serif;
}
a {
text-decoration:none;
font-family:helvetica, arial, sans-serif;
color:#4f2918;
border: 0 none;
}
.tdback1 { background-image: url(images/bracelet-test2.jpg);}
.tdback2 { background-image: url(images/home2.gif);}
.tdback3 { background-image: url(images/shop2.gif);}
.tdback4 { background-image: url(images/about2.gif);}
.tdback5 { background-image: url(images/contact2.gif);}
.fade{opacity:1;transition:opacity .25s ease-in-out;-moz-transition:opacity .25s ease-in-out;-webkit-transition:opacity .25s ease-in-out;}.fade:hover{opacity:0;}.nav-fade{padding:0;}.nav-fade li{background:#fff;padding:3px 8px;display:inline-block;transition:background .25s ease-in-out;-moz-transition:background .25s ease-in-out;-webkit-transition:background .25s ease-in-out;cursor:pointer;}.nav-fade li:hover{background:#000;}.hyphen {
color: #666;
}
img
{ border-style: none;
}
a.image-border {
text-decoration: none;
border: 0 none;
}
iframe.c1 {border:none; width:150px; height:30px}
</style>
HTML
Code:
<table id="Table_01" width="874" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="5"><img src="images/index_01.png" width="792" height="104" alt=""></td>
<td rowspan="9"><img src="images/index_02.png" width="81" height="522" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="104" alt=""></td>
</tr>
<tr>
<td rowspan="9"><img src="images/index_03.png" width="80" height="504" alt=""></td>
<td colspan="4"><img src="images/index_04.gif" width="712" height="94" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="94" alt=""></td>
</tr>
<tr>
<td rowspan="7"><img src="images/index_05.gif" width="88" height="324" alt=""></td>
<td rowspan="6" class="tdback1"><img src="images/Bracelet-test.jpg" width="369" height="252" class="group, fade" alt="Gems de Vine jewelry"></td>
<td class="tdback2"><img src="images/home.gif" width="215" height="63" alt="Gems de Vine Home Page" class="group, fade"></td>
<td rowspan="7"><img src="images/index_08.gif" width="40" height="324" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="63" alt=""></td>
</tr>
<tr>
<td><img src="images/index_09.gif" width="215" height="3" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="3" alt=""></td>
</tr>
<tr>
<td class="tdback3"><a href="shop.html" class="fancybox"><img src="images/shop.gif" width="215" height="56" alt="Gems de Vine Etsy Store" class="group, fade"></a></td>
<td><img src="images/spacer.gif" width="1" height="56" alt=""></td>
</tr>
<tr>
<td class="tdback4"><a href="about.html" class="fancybox"><img src="images/About.gif" width="215" height="57" alt="About Gems de Vine" class="group, fade"></a></td>
<td><img src="images/spacer.gif" width="1" height="57" alt=""></td>
</tr>
<tr>
<td class="tdback5"><a href="http://gemsdevine.wufoo.com/forms/z7x3p9/" class="fancybox"><img src="images/contact.gif" width="215" height="66" alt="Gems de Vine Contact page" class="group, fade"></a></td>
<td><img src="images/spacer.gif" width="1" height="66" alt=""></td>
</tr>
<tr>
<td rowspan="2"><img src="images/index_13.gif" width="215" height="79" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="7" alt=""></td>
</tr>
<tr>
<td><img src="images/index_14.gif" width="369" height="72" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="72" alt=""></td>
</tr>
<tr>
<td colspan="5"><img src="images/index_15.png" width="793" height="86" alt=""></td>
<td><img src="images/spacer.gif" width="1" height="86" alt=""></td>
</tr>
</table>
Sincerely,
Richard Brahm
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
