Popup bild

4 svar · 702 visningar · startad av Howling_W 30 juni 2007

Howling_WMedlem sedan juli 2004132 inlägg

Frågan30 juni 2007 18:00#1

Behöver hjälp med en liten kod. det är så att där jag har bilder på min hemsida vill jag gärna att man skall kunna se bilden i ett större format i ett popupfönster. alltså under den befintliga bilden skall finns t.ex ett förstoringsglas och när man klickar på förstoringsglaset kommer en popup med en större version av bilden. Hur ser koden ut för detta popupfönster?

bossseMedlem sedan juni 2003771 inlägg

1 juli 2007 12:24#2

Ska popupbilderna ha individuell storlek, eller ska alla bilder vara lika stora?
Vilken storlek ska de i.s.f ha?
Och ska de visas på samma plats på sidan?

Howling_WMedlem sedan juli 2004132 inlägg

1 juli 2007 15:50#3

Alla bilder kan ju vara lika stora te.ex 300x300pixel. På samma plats.

bossseMedlem sedan juni 2003771 inlägg

1 juli 2007 19:37#4

Du kan ju testa detta då.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title></title>
<style type="text/css">
<!--
body {background-color:green; color:yellow;}
#bild {width:400px; height:300px; position:absolute;left:250px; top:150px}
#stor {display:none}
-->
</style>
<script type = "text/javascript">
function visaBild(bild)
{
document.getElementById('stor').style.display = 'block'; 
document.getElementById('bild').src=bild; 
}
</script>
</head> 
<body >
Klicka på stora bilden för att stänga den eller klicka på nästa småbild.
<br><br>
<img src="bild1.jpg"; width=60 height=60 onclick="visaBild('bild1.jpg')">
<br>
<img src="bild2.jpg" width=60 height=60 onclick="visaBild('bild2.jpg')">
<br>
<img src="bild3.jpg " width=60 height=60 onclick="visaBild('bild3.jpg')">
<div id="stor">
<img id="bild" onclick="document.getElementById('stor').style.display='none';" >
</div>
</body>
</html>

Howling_WMedlem sedan juli 2004132 inlägg

3 juli 2007 14:30#5

OK tackar!