CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

pablopablo Nybegynder

27. maj 2008 - 13:02 Der er 4 kommentarer og
1 løsning

Visning af billede evt. via java script

Hejsa...

Hvordan opnår jeg lettest denne funktion mht. visning af billeder:

http://www.lauritz.com/ItemList/ItemList.aspx?LanguageId=1&DC=1&CPIn=0&ISz=s&PSz=s&PSzG=s&SO=3&ST=0&ArId=s&TTyp=0&TVal=0&FLId=1&FCId=1&FText=&LLan=s&STA=2

Når musen holdes over et billedet vises det i fuld størrelse.

Mvh. PabloPablo

Synes godt om

w13 Novice

27. maj 2008 - 13:13 #1

Evt. således:
**********************************************
<html>
<head>
<script type="text/javascript">
function showLarge(o){
var oImg=document.getElementById("largeimg");
oImg.setAttribute("src",o.getAttribute("src").replace("_thumb",""));
oImg.style.left=o.offsetLeft+o.offsetWidth+10+"px";
oImg.style.top=o.offsetTop+"px";
oImg.style.display="block"
}
function hideLarge(){
document.getElementById("largeimg").style.display="none"
}
</script>
</head>
<body>

<img src="test1_thumb.jpg" onmouseover="showLarge(this)" onmouseout="hideLarge()"><br>
<img src="test2_thumb.jpg" onmouseover="showLarge(this)" onmouseout="hideLarge()">

<img id="largeimg" style="display:none;position:absolute" src="" width="100" height="100">

</body>
</html>
*****************************************
Så skal dine thumbnails bare hedde _thumb, f.eks. kan du have det store billed "haj1.jpg" og thumbnailen "haj1_thumb.jpg".

Synes godt om

w13 Novice

27. maj 2008 - 13:18 #2

Hov, du skal så lige fjerne: width="100" height="100"

Og koden kan blive kortere:
******************************************
<html>
<head>
<script type="text/javascript">
function showLarge(o){
var oImg=document.getElementById("largeimg");
oImg.setAttribute("src",o.getAttribute("src").replace("_thumb",""));
oImg.style.cssText="display:block;position:absolute;left:"+o.offsetLeft+o.offsetWidth+10+"px;top:"+o.offsetTop+"px"
}
function hideLarge(){
document.getElementById("largeimg").style.display="none"
}
</script>
</head>
<body>

<img src="test1_thumb.jpg" onmouseover="showLarge(this)" onmouseout="hideLarge()"><br>
<img src="test2_thumb.jpg" onmouseover="showLarge(this)" onmouseout="hideLarge()">

<img id="largeimg" style="display:none">

</body>
</html>

Synes godt om

pablopablo Nybegynder

30. maj 2008 - 00:47 #3

Super! Mange tak...Jeg vender tilbage ligeså snart jeg har haft tid til at afprøve det!

Synes godt om

pablopablo Nybegynder

09. juni 2008 - 17:09 #4

Hej igen...

Jeg glemte at sige, at mine billede ligger i en datalist, et billede i hver række. Datalist'en er bundet til databasen, hvor stien til billede også ligger.

Så ovenstående kan ikke rigtig bruges...håber du vil hjælpe mig med dette i stedet for :-)

Synes godt om

pablopablo Nybegynder

25. juni 2008 - 11:12 #5

lukker igen

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Se alle it-kurser fra Computerworld Kurser

IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

Se alle it-kurser

Flere spørgsmål fra ASP.NET kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
valgte i checkboks og comboboks opdater gui og backend Af keepy i ASP.NET	0	01/10/202318:39	-
Webservice Af SommerFyr i ASP.NET	19	11/05/202313:43	31/05/202315:08
ASP:Image og JPG/PDF Af TV47 i ASP.NET	4	25/03/202318:49	31/03/202310:24
www til non-www og HTTPS Af KOH i ASP.NET	2	16/03/202312:31	22/03/202310:19
Window.Open og passing af parameter Af TV47 i ASP.NET	1	14/07/202215:22	20/08/202213:03

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS