Avatar billede hoppe11 Nybegynder
22. september 2007 - 08:17 Der er 1 kommentar

onmouseover write.document

Jeg har en liste af billeder. Når man fører musen over et af billederne skal der vises et preview af billedet, dog skal alle billederne ikke loades fra start, men loades i øjeblikket hvor musen føres over.

Der skal sikkert være en lille timeout så billedet kan nås at blive hentet?
Avatar billede roenving Novice
22. september 2007 - 09:47 #1
Selve preview-tingen lægger du i en div, der ikke vises fra start:

<div id="preview" style="position:absolute;z-index:999;display:none;" onmouseout="this.style.display='none';"><img id="imgPre" style="width:400px;height:300px;"></div>

Billederne sætter du så noget mouseover på:

<img src="pic01_thumb.gif" onmouseover="showPic(this);">

Og så laver du noget script, der kan håndtere dine kald:

<script type="text/javascript">
function getPos(elm) {//jumper
    for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
    return {x:zx,y:zy}
}
function showPic(src){
  //Indsæt kilde til billedet, der skal vises
  //Her udskiftes _thumb.gif med .jpg fra oprindelig kilde
  document.getElementById("imgPre").setAttribute("src", src.getAttribute("src").replace(/_thumb\.gif/,".jpg"));
  //Sæt positionen til billedets position
  var picPos = getPos(src);
  var st = document.getElementById("preview").style;
  st.top = picPos.y + "px";
  st.left = picPos.x + "px";
  st.display = "block";
}
</script>

-- og timeout kommer helt af sig selv, men man kunne jo sætte siden til at hente billederne, når alt ellers er loadet !-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester