Fann annan einfaldari sem gerir það saman, en ég fatta ekki hvernig skal setja hover myndina í sérstaka töflu sem ég staðsetji. þótt ég viti að það sé hægt að færa hover myndina.
CSS:
.gallerygeymsla
{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumalnogl img
{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumalnogl:hover
{
background-color: transparent;
}

.thumalnogl:hover img
{
border: 1px #FF9900;
}

.thumalnogl span{ /*CSS for enlarged image*/
position: absolute;
background-color: #FF9900;
padding: 5px;
left: -1000px;
border: 1px yellow;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumalnogl span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumalnogl:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 200px;
left: 430px; /*position where enlarged image should offset horizontally */
z-index: 50;
}
HTML:
<div class=“gallerygeymsla”>
<a class=“thumalnogl” href=“#tumall”>
<img src=“myndir/spoi.jpg” width=“50px” hspace=“10” vspace=“10” border=“0” />
<span><img src=“myndir/spoi.jpg” />
<br>Spói</span></a>

</div>

.thumalnogl:hover
{
background-color: transparent;
}

.thumalnogl:hover img
{
border: 1px #FF9900;
}

.thumalnogl span{ /*CSS for enlarged image*/
position: absolute;
background-color: #FF9900;
padding: 5px;
left: -1000px;
border: 1px yellow;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumalnogl span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumalnogl:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 200px;
left: 430px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

Sko… Þú þarft að gera þetta með öðru en CSS. Það sem þetta dæmi gerir er að stækka myndina uppí 200x200px þegar þú hoverar yfir hana.

Það sem þú ert að leita að er javascript sem setur stóra mynd í eitthvað hólf. Svosem ekkert gríðarlegt mál.
En það þarf javascript í það.