''onmouseover'' faalt half om half...

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Kobar Secret

Kobar Secret

28/01/2012 12:17:06
Quote Anchor link
beste lezers en helpende handjes :)

Ik ben bezig met het maken van een site voor een kroeg, Nu heb ik op een pagina over de zaal een soort lightbox gemaakt, thumbshow ding.. :P
En hij laat 3 foto`s van de zaal zien, En wanneer je een mouseover doet, Laat hij hem in het groot zien aan de zijkant van de kleine thumbs...

Nu heb ik helaas het probleem dat er naast de 3 kleine thumbs een image staat, die dwars door mijn vergrote thumb gaat?
voorbeeld hier
eenmaal op de pagina even met je cursor over een van de 3 foto`s gaan en je zal zien wat ik hierboven uit probeer te leggen...

Ik zal het script hieronder neerzetten, iemand enig idee hoe ik dit oplos?

Quote:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Café de klok</title>
<style type="text/css">
body
{
background-color: #FFFFFF;
color: #000000;
}
</style>
<style type="text/css">
a:hover
{
color: #90F518;
}
</style>
<!--[if lt IE 7]>
<style type="text/css">
img { behavior: url("pngfix.htc"); }
</style>
<![endif]-->
</head>
<body>
<div id="bv_Image2" style="margin:0;padding:0;position:absolute;left:0px;top:0px;width:1104px;height:828px;text-align:left;z-index:0;">
<img src="images/agrond2.png" id="Image2" alt="" align="top" border="0" style="width:1104px;height:828px;"></div>
<input type="submit" id="Button1" onclick="window.location.href='http://www.fatal-crime.com/v2.0/homepage.php'; ;return false;" name="Homepage" value="Homepage" style="position:absolute;left:118px;top:30px;width:146px;height:59px;font-family:Arial;font-weight:bold;font-size:13px;z-index:1" title="de startpagina">
<input type="submit" id="Button2" onclick="window.location.href='http://www.fatal-crime.com/v2.0/dezaal.php'; ;return false;" name="De zaal" value="De zaal" style="position:absolute;left:262px;top:30px;width:146px;height:59px;font-family:Arial;font-weight:bold;font-size:13px;z-index:2" title="Alles over onze zaal">
<input type="submit" id="Button3" onclick="window.location.href='http://www.fatal-crime.com/v2.0/fotoalbum.php'; ;return false;" name="Foto-album" value="Foto-album" style="position:absolute;left:406px;top:30px;width:146px;height:59px;font-family:Arial;font-weight:bold;font-size:13px;z-index:3" title="Hier vind je geregeld nieuwe foto`s">
<input type="submit" id="Button4" onclick="window.location.href='http://www.fatal-crime.com/v2.0/agenda.php'; ;return false;" name="Agenda" value="Agenda" style="position:absolute;left:550px;top:30px;width:146px;height:59px;font-family:Arial;font-weight:bold;font-size:13px;z-index:4" title="Wanneer is wat nou eigenlijk?">
<input type="submit" id="Button5" onclick="window.location.href='http://www.fatal-crime.com/v2.0/gastenboek/gastenboek.php'; ;return false;" name="Gastenboek" value="Gastenboek" style="position:absolute;left:694px;top:30px;width:146px;height:59px;font-family:Arial;font-weight:bold;font-size:13px;z-index:5" title="Laat een berichtje achter a.u.b!">
<input type="submit" id="Button6" onclick="window.location.href='http://www.fatal-crime.com/v2.0/contact.php'; ;return false;" name="Contact" value="Contact" style="position:absolute;left:838px;top:30px;width:146px;height:59px;font-family:Arial;font-weight:bold;font-size:13px;z-index:6" title="Via deze pagina kunt u heel gemakkelijk contact met ons opnemen">
<div id="bv_TextArt1" style="margin:0;padding:0;position:absolute;left:642px;top:132px;width:291px;height:82px;text-align:center;z-index:7;">
<img src="images/bv01018.png" id="TextArt1" alt="" title="" style="border-width:0;width:291px;height:82px"></div>

<head>
<style type="text/css">
.fotocontainer { position: relative; height: 210px; /* aanpassen aan de hoogte van de grootste afbeelding */ }

/* css-kenmerken kleine afbeelding (indien gewenst) */
.thumb img { }
.thumb:hover { }
.thumb:hover img { }

/* css-kenmerken grote afbeelding */
.thumb span { position: absolute; visibility: hidden; }
.thumb span img { border: solid thin #999999 }
.thumb:hover span {
visibility: visible;
top: 0px; left: 278px;
font-family: arial; font-size: 10pt; text-decoration: none; color: #000000; text-align: center;
z-index: 100; }
</style>
</head>


<body>
<div class="fotocontainer" style="margin:0;padding:0;position:absolute;left:160px;top:160px;width:244px;height:60px;text-align:left;z-index:9;">
<a class="thumb" href="#"><img src="fotoalbum/fotos/foto1b.jpg" width="220px" height="165px" border="0" alt="foto1">
<span><img src="fotoalbum/fotos/foto1.jpg"><br></span></a><br>
<a class="thumb" href="#"><img src="fotoalbum/fotos/foto2.jpg" width="220px" height="165px" border="0" alt="foto2">
<span><img src="fotoalbum/fotos/foto2.jpg"><br></span></a><br>
<a class="thumb" href="#"><img src="fotoalbum/fotos/foto3.jpg" width="220px" height="165px" border="0" alt="foto3">
<span><img src="fotoalbum/fotos/foto3.jpg"><br></span></a><br>
</div>
</body>

<div id="bv_BulletedList1" style="margin:0;padding:0;position:absolute;left:643px;top:508px;width:244px;height:146px;text-align:left;z-index:9;">
<table width="100%" border="0" cellpadding="0" cellspacing="2" id="BulletedList1">
<tr>
<td align="left" valign="top" bordercolor="#C0C0C0" width="72" height="18"><font style="font-size:15px;color=#000000;font-family:Arial">&bull;</font></td>
<td align="left" valign="top" bordercolor="#C0C0C0" width="166" height="18"><font style="font-size:13px" color="#000000" face="Arial"> Zaal&nbsp;&nbsp; +/- 40 m²</font></td>
</tr>
<tr>
<td align="left" valign="top" bordercolor="#C0C0C0" width="72" height="82"><font style="font-size:15px;color=#000000;font-family:Arial">&bull;</font></td>
<td align="left" valign="top" bordercolor="#C0C0C0" width="166" height="82"><font style="font-size:13px" color="#000000" face="Arial"> Kroeg +/- 45m²<br>
<br>
<br>
<br>
</font></td>
</tr>
<tr>
<td align="left" valign="top" bordercolor="#C0C0C0" width="72" height="18"><font style="font-size:15px;color=#000000;font-family:Arial">&bull;</font></td>
<td align="left" valign="top" bordercolor="#C0C0C0" width="166" height="18"><font style="font-size:13px" color="#000000" face="Arial">Zaal&nbsp;&nbsp; +/- 60 personen </font></td>
</tr>
<tr>
<td align="left" valign="top" bordercolor="#C0C0C0" width="72" height="18"><font style="font-size:15px;color=#000000;font-family:Arial">&bull;</font></td>
<td align="left" valign="top" bordercolor="#C0C0C0" width="166" height="18"><font style="font-size:13px" color="#000000" face="Arial">Kroeg +/- 65 personen</font></td>
</tr>
</table></div>
<div id="bv_TextArt2" style="margin:0;padding:0;position:absolute;left:689px;top:472px;width:187px;height:34px;text-align:center;z-index:10;">
<img src="images/bv01019.png" id="TextArt2" alt="" title="" style="border-width:0;width:187px;height:34px"></div>
<div id="bv_TextArt3" style="margin:0;padding:0;position:absolute;left:689px;top:570px;width:187px;height:34px;text-align:center;z-index:11;">
<img src="images/bv01020.png" id="TextArt3" alt="" title="" style="border-width:0;width:187px;height:34px"></div>
<div id="bv_Shape1" style="margin:0;padding:0;position:absolute;left:630px;top:233px;width:310px;height:215px;text-align:center;z-index:12;">
<img src="images/bv01021.gif" id="Shape1" alt="" title="" style="border-width:0;width:310px;height:215px"></div>
</body>
</html>

 
PHP hulp

PHP hulp

18/11/2024 04:36:31
 
Erwin Goossen

Erwin Goossen

28/01/2012 12:30:06
Quote Anchor link
Het probleem zit in de class fotocontainer. deze heeft een z-index van 9. zet deze naar bv 5000 en de kans dat er een element over gaat is klein.
Verder is de code alles behalve leesbaar. Tot mijn schrik staan er 2 body's en 2 head's in. WHYYY??????? (copy/paste?)
Haal verder eens alle inline style elementen eruit en maak hier een duidelijk bestand van.
enz. enz. enz.
 
Kobar Secret

Kobar Secret

28/01/2012 12:58:17
Quote Anchor link
Ja als ik een top scripters was kwam ik niet hier natuurlijk...

Ik kom er niet uit dus ga hulp vragen ja mijn scripts zijn niet de beste, Maargoed ze werken :w

Iig bedankt voor je hulp

Toevoeging op 28/01/2012 13:02:33:

Het heeft gewerkt, Jammer dat je me even op alles moest bikritiseren, maar toch bedankt

Topic mag dicht/weg.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.