Avatar billede lund_dk Praktikant
24. november 2004 - 16:05 Der er 11 kommentarer og
1 løsning

Billede URL i <div>

Tror det er enkelt, ved bare ikke lige selv hvordan.

har et 3 input felter
<input type="text" name="pic1">
<input type="text" name="pic3">
<input type="text" name="pic3">
<input type="submit" value="Vis">

her vil jeg indtaste url til et billede, og ved klik på vis skal billedet sættes ind i en <div> som baggrund.
Avatar billede lund_dk Praktikant
24. november 2004 - 16:10 #1
altså, har selvfølgelig 3 <div>
Avatar billede lund_dk Praktikant
24. november 2004 - 19:11 #2
slet ingen som kan hjælpe lille mig? :(
Avatar billede thomas_yde Nybegynder
25. november 2004 - 09:09 #3
joda
<script>
function showPicture(inpFelt){
  objInp = document.getElementById(inpFelt);
  objDiv = document.getElementById("picDiv");
  objDiv.style.background = "url("+objInp.value+")";
}
</script>
<input type="text" name="pic1" id="pic1">
<input type="button" value="Vis" onClick="showPicture('pic1')">
<div id="picDiv" style="border:1px solid black;width:200px;height:300px;overflow:hidden;"></div>
Avatar billede thomas_yde Nybegynder
25. november 2004 - 19:55 #4
virtuel tavshed?
Avatar billede lund_dk Praktikant
26. november 2004 - 15:59 #5
Jamen det var da skønt :D
Skynd dig at smide et svar..
Avatar billede lund_dk Praktikant
26. november 2004 - 16:02 #6
Men, hvordan klarer jeg koden nemmest når jeg har 3 input felter

pic1, pic2 og pic3 til hver sin div
Avatar billede thomas_yde Nybegynder
29. november 2004 - 08:09 #7
Der bliver du nødt til at udvide den lidt.
Med 3 inpFelter i functionen og ellers gentage hvad jeg har gjort med felt 1.
Så skal du selvfølgelig også have 3 div med hver sin id.

Men du kan tage udgangspunkt i mit eksempel og kopier-
Avatar billede roenving Novice
19. december 2004 - 12:37 #8
<script type="text/javascript">
function visBillede(elm,fld){
  fld = elm.form.elements[fld];
  var divElm = document.getElementById("picDiv" + fld.name.replace(/^.*(\d+)$/,"$1"));
  divElm.style.backgroundImage = "url(" + fld.value + ")";
}
</script>

<form>
<input type="text" name="pic1"><button onclick="visBillede(this,'pic1');">Vis billede 1</button><br>
<input type="text" name="pic2"><button onclick="visBillede(this,'pic2');">Vis billede 2</button><br>
<input type="text" name="pic3"><button onclick="visBillede(this,'pic2');">Vis billede 3</button><br>
</form>
<div id="picDiv1" style="border:1px solid black;width:200px;height:300px;overflow:hidden;"></div>
<div id="picDiv2" style="border:1px solid black;width:200px;height:300px;overflow:hidden;"></div>
<div id="picDiv3" style="border:1px solid black;width:200px;height:300px;overflow:hidden;"></div>
Avatar billede roenving Novice
19. december 2004 - 12:37 #9
Hov, der skulle selvfølgelig stå visBillede(this,'pic3') i den sidste button !-)
Avatar billede lund_dk Praktikant
03. januar 2005 - 14:55 #10
roenving>  Smidt et svar
Avatar billede roenving Novice
03. januar 2005 - 16:40 #11
Velbekomme '-)
Avatar billede roenving Novice
03. januar 2005 - 17:02 #12
Tak for point ;~}
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