|
|||||||||
|
|||||||||
| |||||||||
|
|
|
|
|||||||||
|
|||||||||
| |||||||||
|
|
|
| |||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
Tutorialized Forums Sponsor:
|
|
|
|
#1
May 5th, 2008, 02:03 PM
|
|||
|
|||
|
Change Menu Item Color
I'm working on a website that someone else built and I want to change the color of the menu item "Home" from burgundy to blue, like the other items and change the "careers" item color to burgundy can someone help? thanks. Here's the code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link rel="stylesheet" href="../template_files/template.css">
<title>Solvern Innovations - The Original Source of Solutions</title>
<link rel="shortcut icon" href="http://www.solvern.com/favicon.ico">
<script language="JavaScript"><!--
count = 0;
function strFade()
{
document.all["strID"].filters["alpha"].opacity = count+=4;
if (count <= 100) setTimeout("strFade()",200);
}
// --></script>
<script language="JavaScript"><!--
n = 0;
function fadein()
{
if (n > 100) return;
n += 4;
myIMG.filters['alpha'].opacity = n;
setTimeout("fadein()",200);
}
function fadeout()
{
if (n < 0) return;
n -= 10;
myIMG.filters['alpha'].opacity = n;
setTimeout("fadeout()",200);
}
// --></script>
<style type="text/css">
<!--
.style1 {color: #000000}
-->
</style>
<link href="../style/template.css" rel="stylesheet" type="text/css">
</head>
<body onLoad="fadein()" background="../template_files/background_04.gif" bgcolor="white">
<a name="top"></a>
<!--<body bgcolor="#bdb29c">-->
<!-- Header-->
<table align="center" border="0" cellpadding="0" cellspacing="0" width="750">
<tbody><tr>
<td colspan="4" bgcolor="#a1a1a1"><img alt="" src="../template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr>
<td bgcolor="#a1a1a1"><img alt="" src="../template_files/blank.gif" border="0" height="1" width="1"></td>
<td colspan="2" background="../template_files/background_05.gif" bgcolor="#c0c0c0"><img src="../template_files/big_logo.gif" alt="Solvern Innovations" border="0" height="137" width="750"></td>
<td bgcolor="#a1a1a1"><img src="../template_files/blank.gif" alt="" width="1"></td>
</tr>
<!-- #include file ="C:\Inetpub\wwwroot\MyWeb\header.asp"-->
<tr>
<td colspan="4" bgcolor="#a1a1a1"><img alt="" src="../template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr>
<td bgcolor="#a1a1a1"> <img src="../template_files/blank.gif" alt="" width="1"></td>
<!-- Menu -->
<td bgcolor="#7f98ab" valign="top" width="173"> <table border="0" cellpadding="0" cellspacing="0" width="173">
<tbody>
<tr onMouseOver="this.className='navSelectRollOn';" onMouseOut="this.className='navSelectRollOff';" class="navSelectRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/index.html" class="mainnav">Home</a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/about_solvern_1.html" class="mainnav">About Solvern <img src="../images/arwh.gif" border="0" height="13" width="14"></a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/solutions_1.html" class="mainnav">Solutions <img src="../images/arwh.gif" border="0" height="13" width="14"></a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/business_1.html" class="mainnav">Business Portal <img src="../images/arwh.gif" border="0" height="13" width="14"></a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/careers_1.html" class="mainnav">Careers <img src="../images/arwh.gif" border="0" height="13" width="14"></a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/news_and_events_1.html" class="mainnav">Latest News & Events</a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/contact_us_1.html" class="mainnav">Contact Us</a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a class="mainnav" href="http://www.solvern.com/remote">EASI Login</a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr onMouseOver="this.className='navRollOn';" onMouseOut="this.className='navRollOff';" class="navRollOff">
<td><div class="navpadding"> <a href="http://www.solvern.com/site_map_1.html" class="mainnav">Site Map</a></div></td>
</tr>
<tr>
<td bgcolor="#93a8b8"><img alt="" src="file:///C|/Documents and Settings/elliot.jones/Desktop/solvern-website/template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
</tbody>
</table></td>
<!-- Main-->
<!-- <td valign="top" bgcolor="#FFFFFF" background="images/background_green.jpg" width="631">-->
<td bgcolor="#d7e0df" valign="top" width="631">
<table align="left" border="0" cellpadding="0" cellspacing="0" width="575">
<tbody><tr>
<td>
<!--<div id="strID" style="position:absolute; filter:alpha(opacity=0 )" align="left" size="6">
The Original Source of Solutions</div>--></td>
</tr>
</tbody></table> </td>
<td bgcolor="#a1a1a1"> <img src="../template_files/blank.gif" alt="" width="1"></td>
</tr>
<!--footer-->
<tr>
<td bgcolor="#a1a1a1"><img alt="" src="../template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
<tr>
<td bgcolor="#a1a1a1"> <img src="../template_files/blank.gif" alt="" width="1"></td>
<td colspan="2" align="center" background="../template_files/background_05.gif" bgcolor="#a3afc7"> <p class="footer">Copyright © 2006 All Rights Reserved.</p></td>
<td bgcolor="#a1a1a1"> <img src="../template_files/blank.gif" alt="" width="1"></td>
</tr>
<tr>
<td colspan="4" bgcolor="#a1a1a1"><img alt="" src="../template_files/blank.gif" border="0" height="1" width="1"></td>
</tr>
</tbody></table>
</body>
</html>
|
|
#2
May 5th, 2008, 09:11 PM
|
||||||
|
||||||
|
Open your file called 'template.css' in Dreamweaver and find the following code;
Code:
tr.navRollOn {
background-color: #a6332a;
}
tr.navRollOff {
background-color: #68869d;
}
tr.navSelectRollOn {
background-color: #a6332a;
}
tr.navSelectRollOff {
background-color: #a6332a;
}
tr.navSubRollOn {
background-color: #406563;
}
tr.navSubRollOff {
background-color: #6B8B89;
}
tr.navSubSelectRollOn {
background-color: #406563;
}
tr.navSubSelectRollOff {
background-color: #406563;
}
tr.navSub2RollOn {
background-color: #616161;
}
tr.navSub2RollOff {
background-color: #808080;
}
tr.navSub2SelectRollOn {
background-color: #616161;
}
tr.navSub2SelectRollOff {
background-color: #616161;
}
tr.navSeaportRollOn {
background-color: #333333;
}
tr.navSeaportRollOff {
background-color: #666666;
}
Find this hex color; a6332a in your CSS and change it to another, this will replace the Burgundy. Find this hex color; 406563 in your CSS and change it to another, this will replace the green. Hope this helps 
|
|
#3
May 6th, 2008, 09:04 AM
|
|||
|
|||
|
Thanks. I figured it out. I had to change the
Code:
<tr onMouseOver="this.className='navSelectRollOn';" onMouseOut="this.className='navSelectRollOff';" class="navSelectRollOff"> from the Home button to the Careers button.
|
|
| Viewing: Tutorialized Forums > Web Design & Development > Dreamweaver > Change Menu Item Color |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
 |
|
|
|
|
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
