Setting page properties differently for different parts of the page

**Tyskie01** · 06-05-2007 09:02 AM

Hi,

This is something I don't think I could work out on my own, but! Again, working with the following site http://www.lobacz.com

You can see the bottom-most text "web design - ted lobacz............................... site construction - luke gliwa". Now I'd like to make the words 'ted lobacz' and 'luke gliwa' link to our respective e-mail addresses using a mailto: link. However, when I do this, and the links are clicked they turn black, because of the page properties I set when making the page for the original text that can be found on the billboard itself. All text colour and link colours are set to black, because I want it that way, but only for the words 'ted lobacz' and 'gallery', but I want the grey text to stay grey too when the links are clicked.

How would I go about doing this? I really am quite

.

Thanks,

Tyskie01.

page code:

Code:

<!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>The Park Project</title>
<style type="text/css">
<!--
body,td,th {
	font-family: Verdana;
	font-size: 14px;
	color: #000000;
}
body {
	background-color: #000000;
}
a {
	font-size: 14px;
	color: #000000;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #000000;
}
a:hover {
	text-decoration: none;
	color: #000000;
}
a:active {
	text-decoration: none;
	color: #000000;
}
-->
</style>
<link href="div.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<style type="text/css">
<!--
.style1 {color: #ABABAB}
.style2 {color: #030303}
-->
</style>
</head>

<body>
<div align="center">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p><img src="billboard WEB.jpg" width="700" height="483" /></p>
  <div class="style1" id="designconstruction">web design - ted lobacz<span class="style2">...............................</span> site construction - luke gliwa</div>
  <div id="bbawp">british black and white photography</div>
  <div id="gallery" onmouseover="MM_goToURL('parent','page1.html');return document.MM_returnValue"><a href="page1.html">gallery</a></div>
  <div id="tedlobacz" onmouseover="MM_goToURL('parent','cv.html');return document.MM_returnValue"><a href="cv.html">ted lobacz</a></div>
</div>

<!-- Start of StatCounter Code -->
<script type="text/javascript" language="javascript">
var sc_project=2613459; 
var sc_invisible=0; 
var sc_partition=25; 
var sc_security="0214c694"; 
</script>

<script type="text/javascript" language="javascript" src="http://www.statcounter.com/counter/counter.js"></script><noscript><a href="http://www.statcounter.com/" target="_blank"><img  src="http://c26.statcounter.com/counter.php?sc_project=2613459&java=0&security=0214c694&invisible=0" alt="blog stats" border="0"></a> </noscript>
<!-- End of StatCounter Code -->

<script type="text/javascript" language="JavaScript">
<!--

//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com

var message="© Ted Lobacz";

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}

document.oncontextmenu=new Function("alert(message);return false")

// --> 
</script>

</body>
</html>

**KDLA** · 06-05-2007 09:19 AM

Create a class for those particular links:

Code:

a.gray {color: #eee;}

Then apply it to those links:

Code:

<a href="mailto:you@domain.com" class="gray">Mail Me</a>

**Tyskie01** · 06-05-2007 09:28 AM

That works perfectly! Thank-you very much

I'm starting to understand scripting now too.

Thread: Setting page properties differently for different parts of the page

Thread Tools

Display

Setting page properties differently for different parts of the page

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions