Problemed med mouseover script på produktbilleder
Hej eksperterJeg er igang med et website, hvor der er produkter i en database. Ved mouseover på produktbillede, skal et større billede blive vist. Det virker fint i explorer, dog ligger billedet bag et designbillede, men i mozilla driller det hele.
Se evt. website: www.foodsense.dk/vine.php
Jeg håber nogen kan hjælpe mig, da jeg ikke har erfaring med javascript, og det kan være det er simplere end jeg tror:).
<img id="stor" class="hover" style="z-index:99;"/>
<?php
print '<div class="scrolltekst">
<div style="text-align: left; vertical-align:top">';
// load images
$tmp = mysql_query("SELECT * FROM `shop_productimage` ORDER BY productid");
$images = array();
while ($row = mysql_fetch_array($tmp)) {
$images[$row['productid']][] = array($row['imageurl'],$row['bigimageurl']);
}
$Kategori = "2";
$productquery = mysql_query("SELECT * FROM shop_products WHERE active = 'yes' AND kategori = ".$Kategori);
while ($object = mysql_fetch_object($productquery)) {
$totalimage = count($images[$object->id])-1;
if ($totalimage < 0) {
$image = "None";
$big = "NoneBig";
} else {
$rand = rand(0,$totalimage);
$image = $images[$object->id][$rand][0];
$big = $images[$object->id][$rand][1];
}
printf('<div>
<table width="450">
<tr>
<td colspan="2" valign="top" class="productHeaderText"><a href="Produkt.php?ID=%d" class="showProductLink">%s</a></td>
</tr>
<tr>
<td width="100" valign="top">
<a href="Produkt.php?ID=%d"><img src="/Image/%s" alt="" onmousemove="visbil(\'/Image/%s.jpg\',event)" onmouseout="skjul();" style="border:1px solid black;"></a>
</td>
<td width="350" valign="top" class="productDescription">%s</td>
<td align="center" width="100" class="productAddToCartTd" valign="top">%s<br /><form action="cart.action.php" method="get"><input type="hidden" value="add" name="action"><input type="text" name="quantity" value="1" size="2"><input type="hidden" name="id" value="%d"><br /><input type="submit" class="btnAddToCart" name="btnAddToCart" value="Læg i kurv"></form></td>
</tr>
</table>
</div>',$object->id,$object->name,$object->id,$image,$big,nl2br($object->description),dkprice($object->price/100*1.25),$object->id);
}
echo '
</div>
</div>
JAVASCIPTET KODEN
<script type="text/javascript">
var ie = (document.all)?true:false
function visbil(str,f){
e = document.getElementById('stor')
if(ie){
e.style.top = f.clientY + document.body.scrollTop + 5;
e.style.left = f.clientX + document.body.scrollLeft; + 5}
else{
e.style.top = f.pageY+20 + 5;
e.style.left = f.pageX; + 5}
vis = (e.style.display=='none')?true:false
if(vis){
e.src = str;
e.style.display = "inline";
}
}
function skjul()
{
document.getElementById('stor').style.display = "none";
}
</script>
