here is my coding so far
<HTML>
<HEAD>
<style type="text/css">
#dhtmltooltip{
position: absolute;
width: 150px;
border: 2px solid black;
padding: 2px;
background-color: lightyellow;
visibility: hidden;
z-index: 100;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
}
</style>
<TITLE>MYSPACE PAGE IN PROGRESS</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
</HEAD>
<BODY BGCOLOR=#FFFFFF LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
<div id="dhtmltooltip"></div>
<script type="text/javascript">
/***********************************************
* Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var offsetxpoint=-60 //Customize x offset of tooltip
var offsetypoint=20 //Customize y offset of tooltip
var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""
function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function ddrivetip(thetext, thecolor, thewidth){
if (ns6||ie){
if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
tipobj.innerHTML=thetext
enabletip=true
return false
}
}
function positiontip(e){
if (enabletip){
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20
var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000
//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth)
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
else if (curX<leftedge)
tipobj.style.left="5px"
else
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetxpoint+"px"
//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight)
tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
else
tipobj.style.top=curY+offsetypoint+"px"
tipobj.style.visibility="visible"
}
}
function hideddrivetip(){
if (ns6||ie){
enabletip=false
tipobj.style.visibility="hidden"
tipobj.style.left="-1000px"
tipobj.style.backgroundColor=''
tipobj.style.width=''
}
}
document.onmousemove=positiontip
</script>
<!-- ImageReady Slices (MYSPACE PAGE IN PROGRESS.psd) -->
<TABLE WIDTH=983 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=11>
<IMG SRC="images/popcorn_01.jpg" WIDTH=983 HEIGHT=17 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=6>
<IMG SRC="images/popcorn_02.jpg" WIDTH=740 HEIGHT=201 ALT=""></TD>
<TD COLSPAN=4>
<A HREF="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=25763964">
<IMG SRC="images/photos.jpg" WIDTH=191 HEIGHT=201 BORDER=0 ALT=""></A></TD>
<TD ROWSPAN=5>
<IMG SRC="images/popcorn_04.jpg" WIDTH=52 HEIGHT=526 ALT=""></TD>
</TR>
<TR>
<TD ROWSPAN=4>
<IMG SRC="images/popcorn_05.jpg" WIDTH=390 HEIGHT=325 ALT=""></TD>
<TD COLSPAN=2>
<A HREF="http://comment.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=25763964">
<IMG SRC="images/comment-me.jpg" WIDTH=137 HEIGHT=33 BORDER=0 ALT=""></A></TD>
<TD COLSPAN=2>
<A HREF="http://comment.myspace.com/index.cfm?fuseaction=user.viewComments&friendID=25763964">
<IMG SRC="images/view-comments.jpg" WIDTH=170 HEIGHT=33 BORDER=0 ALT=""></A></TD>
<TD COLSPAN=3>
<A HREF="http://messaging.myspace.com/index.cfm?fuseaction=mail.message&friendID=25763964">
<IMG SRC="images/message-me.jpg" WIDTH=136 HEIGHT=33 BORDER=0 ALT=""></A></TD>
<TD COLSPAN=2>
<A HREF="http://collect.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=25763964">
<IMG SRC="images/add-me.jpg" WIDTH=98 HEIGHT=33 BORDER=0 ALT=""></A></TD>
</TR>
<TR>
<TD COLSPAN=9>
<IMG SRC="images/popcorn_10.jpg" WIDTH=541 HEIGHT=52 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG SRC="images/about-me.jpg" WIDTH=116 HEIGHT=24 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="images/interests.jpg" WIDTH=117 HEIGHT=24 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/golf.jpg" WIDTH=176 HEIGHT=24 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="images/the-wife.jpg" WIDTH=105 HEIGHT=24 ALT=""></TD>
<TD ROWSPAN=2>
<IMG SRC="images/popcorn_15.jpg" WIDTH=27 HEIGHT=240 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=8>
<IMG SRC="images/popcorn_16.jpg" WIDTH=514 HEIGHT=216 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=390 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=116 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=21 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=96 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=74 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=43 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=59 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=34 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=71 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=27 HEIGHT=1 ALT=""></TD>
<TD>
<IMG SRC="images/spacer.gif" WIDTH=52 HEIGHT=1 ALT=""></TD>
</TR>
</TABLE>
<!-- End ImageReady Slices -->
</BODY>
</HTML>
.................................................................................................... ............
Now im not sure where to put this link
onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)";
onMouseout="hideddrivetip()"
as i want to use it in the following sections
<TR>
<TD>
<IMG SRC="images/about-me.jpg" WIDTH=116 HEIGHT=24 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="images/interests.jpg" WIDTH=117 HEIGHT=24 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/golf.jpg" WIDTH=176 HEIGHT=24 ALT=""></TD>
<TD COLSPAN=2>
<IMG SRC="images/the-wife.jpg" WIDTH=105 HEIGHT=24 ALT=""></TD>
<TD ROWSPAN=2>
<IMG SRC="images/popcorn_15.jpg" WIDTH=27 HEIGHT=240 ALT=""></TD>
</TR>
i know how to add input to the code,as in the words i want to show when you hover,im just not sure how to structure it into the areas i waqnt it in.
im not really sure how to adjust the positionand size of the box change the font and get rid of the drop shadow idealy i want the boxto appear in the gap at the bottom of the page and spread out right across the wasted space,
if you understand what i mean