forstørrelse af billede v mouseover, hvordan?

Jeg har brugt følgende, men det er godtnok ved hjælp af CSS.

http://cssglobe.com/post/1305/create-resizing-thumbnails-using-overflow-property

det ser helt genialt ud. mange tak. jeg har bare lidt svært ved at gennemskue koderne. Betyder det at henvisningen http://cssglobe.com, der skulle svare til det store foto, ligger på den side. Eller kan du forklare hvordan det hænger sammen, så jeg bliver i stand til at rekonstruere det?

:o)

- nu er jeg nået så langt at det fungerer nogenlunde, men det er som at kodningen insisterer på, at det skal være samme billede der forstørres. Man kan desværre ikke bare skrifte de små ud med fotos i en hensigtsmæssig thumbs-beskæring.

Jeg har gjort som følger:
<p class="thumb"><a href="P1020061b.jpg"><img src="P1020061.jpg" /></a></p>
<p class="thumb"><a href="P1020065b.jpg"><img src="P1020065.jpg" /></a></p>
<p class="thumb"><a href="P1020074b.jpg"><img src="P1020074.jpg" /></a></p>
<p class="thumb"><a href="P1020087b.jpg"><img src="P1020087.jpg" /></a></p>

og alligevel viser den kun det store billede begge gage, dvs et meget lille udsnit af det store billede, når det gælder thumben. det er i dette tilfælde uhensigtsmæssigt.

Det ku være rat at få løst gåden, men tak i alle tilfælde :o)

Du kan se jeg har brugt det her:
http://www.elvstromsails.com/ImageGallery_Details_Sailing.aspx?AlbumID=4&Lang=HQ

Der er fordi du skal bruge liste for istedet for <p>

<ul id='thumbs'>
<li><a href=""><img alt="" src="" width="400px" /></a></li>
<li><a href=""><img alt="" src="" width="400px" /></a></li>
<li><a href=""><img alt="" src="" width="400px" /></a></li>
<li><a href=""><img alt="" src="" width="400px" /></a></li>
</ul>

grunden til at jeg ikke bruger liste er at
1) jeg ikke har været ude for at listen har påvirket funktionernes duelighed i negativ retning alligevel, så om den er der skulle være ligegyldigt
2) placeringen af mine fotos er vertikalt, hvorfor jeg skulle igang med så at sætte mig ind i hvordan jeg ville være nødt til at skrive det for at placeringen holder på hjemmesiden http://www.yogi4rent.com/

Så prøv følgende:

<p class="thumbnail"><a href="P1020061b.jpg"><img src="P1020061.jpg" /></a></p>
<p class="thumbnail"><a href="P1020065b.jpg"><img src="P1020065.jpg" /></a></p>
<p class="thumbnail"><a href="P1020074b.jpg"><img src="P1020074.jpg" /></a></p>
<p class="thumbnail"><a href="P1020087b.jpg"><img src="P1020087.jpg" /></a></p>

/* single thumbnail */

    p.thumbnail
{
    float: right;
    margin: 2px 10px 2px 0;
    border: 1px solid #999;
    padding: 2px;
}
    p.thumbnail a
{
    display: block;
    float: left;
    width: 250px;
    height: 250px;
    line-height: 150px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}   
    p.thumbnail a img
{
    float: right;
    position: absolute;
    top: -5px;
    left: -20px;
}
   
    /* mouse over */
   
        p.thumbnail a:hover
{
    overflow: visible;
    z-index: 1000;
    border: none;
}
        p.thumbnail a:hover img
{
    border: 1px solid #999999;
    background: #ffffff;
    padding: 2px;
    /*max-height: 558px;
    max-width:788px;*/
}   
.floatingtext
{
    padding: 0px;
    margin: 0px 0px 0px 20px;
    position: absolute;
    z-index: 2;
    top: 10px;
    color: #CC0000;
    font-weight: bold;
}
   
    /* // mouse over */   

/* // single thumbnail */

Hej Elvstine,
du må sige stop, hvis det bliver for meget. Jeg har nu lagt dit forslag op i htm-filens head på http://www.yogi4rent.com/index-overflov.htm, og som du kan læse i koderne, har jeg måttet slette alle margen pixels, borderpx og padding, men nu ses de tre fotos, som det gælder, ikke.
Jeg melder pas på denne vej.

Jeg fortsår ikke helt hvad dit problem er.
Jeg kan ikke se nogle billeder.
På koden ser det ud aom om du har alle dine billder liggende mellem dine html filer - er det rigtigt?

Jeg ville tro du skulle skirve n oget i stil med:

<p class="thumbnail"><a href="[stien til hvor dine billeder ligger]/P1020061b.jpg"><img src="[stien til hvor dine billeder ligger]P1020061.jpg" /></a></p>

hvis du kigger på http://www.yogi4rent.com kan du se fotos'ene. referencen er helt den samme, så ja.. det er svært at gennemskue, hvorfor man ikke ser fotos'ene.
- undskyld, men det bliver simpelthen for svært for mig at forstå hvad du m,ener jeg skal gøre. Hvor jeg skal lægge dit forslag ind, hvad jeg skulle slette til gengæld. Sådan grebet ud i den blå luft ku det tage mig laaang tid, bare at finde ud af hvad du mener. Også selvom det sikkert er helt logisk for en indforstået.