PDA

View Full Version : cs4 dreamweaver live view images not working


shellynealfl
02-24-2011, 01:24 AM
Here is my problem. I am designing a website for a class project, and in the design view my background images (in my #nav) and colors are showing up, but in live view they are not. Also my footer link text is not changing in live view on hover. I have no idea what I am doing wrong. I am including the coding for both the page I am working on and the css. If anyone can give me an idea of what I am doing wrong I would greatly appreciate it.

Coding ~
<!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>Untitled Document</title>
<link href="/styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
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_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_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>
<meta name="Keywords" content="news, mid missouri, midmissouri, sports, community, entertaiment, weather, bath salts ban, Schwartzenegger, ham dinner, krcg news, dessert classic, McIroy" /><meta name="description" content="Mid-Missouri's news, weather, sports, community events, and entertainment. For all your local needs." />
</head>

<body onload="MM_preloadImages('images/btnhomeover.jpg','images/btnnewsover.jpg','images/btnweatherover.jpg','images/btnsportsover.jpg','images/btncommunityover.jpg','images/btnentertainmentover.jpg')">

<div id="nav"><br /><br /><br /><br />
<br />&nbsp;&nbsp;
<a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home button','','images/btnhomeover.jpg',1)"><img src="images/btnhomeup.jpg" alt="Home Button" name="home button" width="124" height="26" border="0" id="home button" /></a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="news" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('News','','images/btnnewsover.jpg',1)"><img src="images/btnnewsup.jpg" alt="News Button" name="News" width="124" height="26" border="0" id="News" /></a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="weather" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Weather','','images/btnweatherover.jpg',1)"><img src="images/btnweatherup.jpg" alt="Weather button" name="Weather" width="124" height="25" border="0" id="Weather" /></a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="sports" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Sports','','images/btnsportsover.jpg',1)"><img src="images/btnsportsup.jpg" alt="Sports button" name="Sports" width="124" height="26" border="0" id="Sports" /></a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="community" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Community','','images/btncommunityover.jpg',1)"><img src="images/btncommunityup.jpg" alt="community button" name="Community" width="124" height="26" border="0" id="Community" /></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="entertainment" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Entertainment','','images/btnentertainmentover.jpg',1)"><img src="images/btnentertainmentup.jpg" alt="entertainment" name="Entertainment" width="124" height="26" border="0" id="Entertainment" /></a></div></div>
<div id="bodycontent"></div>
<div id="footer"><br /><center>
<a href="index.html" title="home">Home</a> | <a href="news" title="news">News</a> | <a href="weather" title="weather">Weather</a> | <a href="sports" title="sports">Sports</a> | <a href="community" title="community">Community</a> | <a href="entertainment" title="entertainment">Entertainment</a>
<br /> <copyrighttext>
Copyright 2011 Barrington Broadasting Group, LLC all rights reserved<br />Student project by Teri Neal</copyrighttext>
</center></div>
</body>
</html>


CSS ~

@charset "UTF-8";
h1 {
font-family: Tahoma, Geneva, sans-serif;
font-size: 36px;
font-style: italic;
line-height: normal;
font-weight: bold;
color: #00F;
}
#bodycontent {
height: 604px;
width: 1000px;
background-color: #d1d1d3;
}
#nav {
background-image: url(images/bannerwlogo.jpg);
background-attachment: fixed;
}
#footer {
height: 73px;
width: 1000px;
background-color: #d1d1d3;
color: #FF0233;
font-weight: normal;
text-decoration: none;
}
copyrighttext {
font-size: 10px;
color: #000;
}
#footer a:link{
font-size: 14px;
font-weight: bold;
color: #f7101b;
text-decoration: none;
font-family: "Times New Roman", Times, serif;
background-color: #d1d1d3;
}
#footer a:visited {
color: #ffffff;
text-decoration: line-through;
background-color: #d1d1d3;
}
#footer a:hover {
color: #2130f5;
text-decoration: none;
background-color: #d1d1d3;
}
#footer a:active {
color: #000000;
background-color: #d1d1d3;
}

johnMoss
02-24-2011, 03:20 AM
To begin with, fix your css id's for H1 & copywritetext; both are missing the # designator for ID

shellynealfl
02-24-2011, 03:41 AM
I fixed those but still have the same problem. Thanks for pointing them out to me.

DWcourse
02-24-2011, 03:44 AM
actually h1 is an html tag so it doesn't need a # in front of it. And the <h1> tag doesn't appear to be used on the page anyway.

copyrighttext as used is a custom html tag which is allowed (although I'm not sure how well supported it is).

Neither appear to be the problem here.

I can't see the problem with your background-image although perhaps it would be easier to find if you uploaded the page and posted a link.

As for the footer links, your rollover colors worked fine when I used your code in a page.

johnMoss
02-24-2011, 03:44 AM
#nav css: is bannerwlogo the correct name of the file? shouldn't matter since you say they work in design but just curious...