-
Problem with tooltip html - so close - HELP
ok this is a pretty specific technical question because I've tried everything I could on my own and this is my last resort. I am using a tooltip html (which I got off of this site). I am using it in a pretty complicated way tho. I took a map of the dorms at my school and cut it up into 340 little squares. I then took some of the squares (all of which are little GIFs) and attatched a tooltip code to them so that when you mouse over a certain dorm, it tells you who lives there. It took a while but it came out really cool and works perfect when I preview it in a browser through dreamweaver. But I have just tried publishing the site and none of the map comes up. I see a bunch of little picture icons but they all disappear after a few seconds. I'm so close to finishing this and it would be really cool if I could publish it but I cannot figure out what I'm doing wrong. Somebody please help. I dont know what the problem could be. It works perfect when I preview it - sorry for the long technical question any help would be much appreciated....thanks!!
-
-
It would be a better idea to use a single image and <area> tags. As it is, you should link to the page if you want us to help.
-
-
www.bonervision.net/modsmap
I know its a wierd domain name but my nickname is bona so I just picked it cuz its funny. Anyway heres some of the code I used....
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
<!--
body {
background-image: url(background.gif);
background-color: #E0DFE3;
}
#dhtmltooltip{
font: normal 14px tahoma;
position: absolute;
width: 150px;
border: 3px 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*/
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Mod-O-Matic Collegiate Friend Finder</title>
<script language="JavaScript" type="text/JavaScript">
<!--
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_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_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>
</head>
<body onLoad="MM_preloadImages('modsmainbutton_mouseover.gif','homebutton_mouseover.gif','coolkidsbutton_mouseover.gif')">
<div id="dhtmltooltip"></div>
<div align="center">
<table width="874" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="180"><a href="themods.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image341','','modsmainbutton_mouseover.gif',1)"><img src="modsmainbutton.gif" name="Image341" width="180" height="165" border="0"></a><a href="index.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image342','','homebutton_mouseover.gif',1)"><img src="homebutton.gif" name="Image342" width="180" height="165" border="0"></a><a href="#http://pub38.bravenet.com/guestbook/3230062235/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image343','','coolkidsbutton_mouseover.gif',1)"><img src="coolkidsbutton.gif" name="Image343" width="180" height="165" border="0"></a></td>
<td width="663" bordercolor="#000000"><table width="663" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="82"><img src="Zmods_01.gif" width="82" height="53"></td>
<td width="30"><img src="Zmods_02.gif" width="30" height="53"></td>
<td width="32"><img src="Zmods_03.gif" width="32" height="53"></td>
<td width="32"><img src="Zmods_04.gif" width="32" height="53"></td>
<td width="31"><img src="Zmods_05.gif" width="31" height="53"></td>
<td width="27"><img src="Zmods_06.gif" width="27" height="53"></td>
<td width="27"><img src="Zmods_07.gif" width="27" height="53"></td>
<td width="32"><img src="Zmods_08.gif" width="32" height="53"></td>
<td width="31"><img src="Zmods_09.gif" width="31" height="53"></td>
<td width="30"><img src="Zmods_10.gif" width="30" height="53"></td>
<td width="24"><img src="Zmods_11.gif" width="24" height="53"></td>
<td width="29"><img src="Zmods_12.gif" width="29" height="53"></td>
<td width="31"><img src="Zmods_13.gif" width="31" height="53"></td>
<td width="31"><img src="Zmods_14.gif" width="31" height="53"></td>
<td width="30"><img src="Zmods_15.gif" width="30" height="53"></td>
<td width="35"><img src="Zmods_16.gif" width="35" height="53"></td>
<td width="20"><img src="Zmods_17.gif" width="20" height="53"></td>
<td width="33"><img src="Zmods_18.gif" width="33" height="53"></td>
<td width="32"><img src="Zmods_19.gif" width="32" height="53"></td>
<td width="44"><img src="Zmods_20.gif" width="44" height="53"></td>
</tr>
<tr>
<td><img src="Zmods_21.gif" width="82" height="30"></td>
<td><img src="Zmods_22.gif" width="30" height="30"></td>
<td><a onMouseOver="ddrivetip('<b><big> 28B </big></b><br> Dan McDonald <br> Carl Sohn <br> Keith Keavney <br> Mike Fox <br> Woody Tondorf <br> Mike Grant <','#0077FF', 125)";
onMouseOut="hideddrivetip()"><img src="Zmods_23.gif" width="32" height="30"></a></td>
<td><img src="Zmods_24.gif" width="32" height="30"></td>
<td><img src="Zmods_25.gif" width="31" height="30"></td>
<td><img src="Zmods_26.gif" width="27" height="30"></td>
<td><img src="Zmods_27.gif" width="27" height="30"></td>
<td><img src="Zmods_28.gif" width="32" height="30"></td>
<td><img src="Zmods_29.gif" width="31" height="30"></td>
<td><a onMouseOver="ddrivetip('<b><big> 34B </big></b><br> John Montana <br> Matthew Morici <br> Nick Helfenstein <br> Blane Magee <br> Chris Mcann <br> Ryan Walters <','#0077FF', 125)";
onMouseOut="hideddrivetip()"><img src="Zmods_30.gif" width="30" height="30"></a></td>
<td><img src="Zmods_31.gif" width="24" height="30"></td>
<td><img src="Zmods_32.gif" width="29" height="30"></td>
<td><img src="Zmods_33.gif" width="31" height="30"></td>
<td><img src="Zmods_34.gif" width="31" height="30"></td>
<td><img src="Zmods_35.gif" width="30" height="30"></td>
<td><img src="Zmods_36.gif" width="35" height="30"></td>
<td><img src="Zmods_37.gif" width="20" height="30"></td>
<td><img src="Zmods_38.gif" width="33" height="30"></td>
<td><img src="Zmods_39.gif" width="32" height="30"></td>
<td><img src="Zmods_40.gif" width="44" height="30"></td>
</tr>
<tr>
<td><img src="Zmods_41.gif" width="82" height="28"></td>
<td><img src="Zmods_42.gif" width="30" height="28"></td>
<td><img src="Zmods_43.gif" width="32" height="28"></td>
<td><img src="Zmods_44.gif" width="32" height="28"></td>
<td><img src="Zmods_45.gif" width="31" height="28"></td>
<td><img src="Zmods_46.gif" width="27" height="28"></td>
<td><img src="Zmods_47.gif" width="27" height="28"></td>
<td><img src="Zmods_48.gif" width="32" height="28"></td>
<td><img src="Zmods_49.gif" width="31" height="28"></td>
<td><img src="Zmods_50.gif" width="30" height="28"></td>
<td><img src="Zmods_51.gif" width="24" height="28"></td>
<td><img src="Zmods_52.gif" width="29" height="28"></td>
<td><img src="Zmods_53.gif" width="31" height="28"></td>
<td><img src="Zmods_54.gif" width="31" height="28"></td>
<td><img src="Zmods_55.gif" width="30" height="28"></td>
<td><img src="Zmods_56.gif" width="35" height="28"></td>
<td><img src="Zmods_57.gif" width="20" height="28"></td>
<td><img src="Zmods_58.gif" width="33" height="28"></td>
<td><img src="Zmods_59.gif" width="32" height="28"></td>
<td><img src="Zmods_60.gif" width="44" height="28"></td>
</tr>
<tr>
<td><img src="Zmods_61.gif" width="82" height="27"></td>
<td><a onMouseOver="ddrivetip('<b><big> 29B </big></b><br> Emily Kives <br> Carolyn Kron <br> Kate Patten <br> Melanie Nesse <br> Julie Harding <br> Michelle Tebsheran <','#FE01F5', 125)";
onMouseOut="hideddrivetip()"><img src="Zmods_62.gif" width="30" height="27"></a></td>
<td><img src="Zmods_63.gif" width="32" height="27"></td>
<td><img src="Zmods_64.gif" width="32" height="27"></td>
<td><img src="Zmods_65.gif" width="31" height="27"></td>
I obviously could fit it all but thats pretty much how it goes.....theres a bunch of images in a table and some of them have a tooltip on it with people's names. I am basically a newb so please be basic when replying. Thanks so much.
-
-
if I use <area> tags then I can use one image and just have a tooltip linked to a certain area of that image? That would be perfect cuz thats basically what I'm doing here. How does that work?
-
-
i am trying to find out how to use the area tag by searching html stuff but i dont think it will work with this tooltip code......does anyone know if it will? thanks.
-
-
i just did the whole thing over with the table how I did before and I think its working now....ill post the link when its all done.....thanks
-
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
Reply With Quote
Bookmarks