Avatar billede viggosmor Nybegynder
21. april 2008 - 15:14 Der er 13 kommentarer og
1 løsning

linke fra en lille thumnail til et større billede på samme side

Vi er på min uddannnelse ved at skulle lave en webshop, og vi skal sælge fladskærms tv...

Vi skal i webshoppen have et fjernsyn som man kan få i lad os sige 3 farver...

Jeg skal finde ud af hvordan jeg nemmest eller bedst kan linke fra en lille thumbnail, med farveprøverne, til et stort billede af fjernsynet i den pågældende farve....

dette skal foregå på samme side, altså ikke noget med at popup... af fjernsynet, men det skal være lige oppe over farveprøverne....

Har nu brugt det meste af idag på at lede efter dette på netttet, men kan slet ikke finde noget der vedrører dette...

Jeg ved ikke engang om det skal laves i css eller om det er javascript eller php der skal ind i billedet....

Så har virkelig brug for hjælp...

takker lone
Avatar billede olebole Juniormester
21. april 2008 - 15:22 #1
<ole>

Hvis dine thumbnails hedder det samme som de store billeder - og de ligger i mapperne 'thumbs' og 'images', kan du skrive:

<script type="text/javascript">
function showPic(oThumb) {
    var oImg = document.getElementById("displPic");
    oImg.setAttribute("src", oThumb.getAttribute("src").replace("thumb", "images"));
}
</script>

<img src="thumbs/tv_roed.gif" onclick="showPic(this)" alt="">
<img src="thumbs/tv_gul.gif" onclick="showPic(this)" alt="">
<img src="thumbs/tv_blaa.gif" onclick="showPic(this)" alt="">

<img id="displPic" src="">

/mvh
</bole>
Avatar billede olebole Juniormester
21. april 2008 - 15:23 #2
- næsten:
    oImg.setAttribute("src", oThumb.getAttribute("src").replace("thumbs", "images"));
Avatar billede viggosmor Nybegynder
21. april 2008 - 15:46 #3
Perfekt ole...

Det var lige det jeg behøvede...

Det eneste er bare at farverne lægger sig ved siden af fjernsynet.... og ikke nedenunder men det kan der vel gøres noget ved.....
Avatar billede viggosmor Nybegynder
21. april 2008 - 15:52 #4
en anden ting er også at når man lige kommer ind på siden så er der et rødt kryds, det er først når man trykker på en farve at fjernsynet kommer frem...
Kan man ikke gøre det sådan at fjernsyn nr. ét er valgt som default?
Avatar billede jokkejensen Novice
21. april 2008 - 16:01 #5
Det er bare skrive hvilket billede der skal vises på <img id="displPic" src="">

Når nu det er uddannelse, plejer man at få lidt ros for at benytte nye teknikker, tag at kigge på Mediarss og ajax. Der er nogle færdige viewers, men også let at lave sin egen.
Avatar billede viggosmor Nybegynder
21. april 2008 - 16:08 #6
Nå ja hvor nemt kunne det lige være, havde ikke set ordentligt på koden førend jeg postede....

Oki jeg vil da kigge på det du foreslog... :)
Avatar billede jokkejensen Novice
21. april 2008 - 16:37 #7
CSS
#Images div img
{
float:left;
/* sæt evt fast højde og bredde, for at de står flot */
}

<div id="Images">
<img id="displPic" src="">
<div>
<img src="thumbs/tv_roed.gif" onclick="showPic(this)" alt="">
<img src="thumbs/tv_gul.gif" onclick="showPic(this)" alt="">
<img src="thumbs/tv_blaa.gif" onclick="showPic(this)" alt="">
<div style="clear:both;"></div>
</div>
</div>
Avatar billede viggosmor Nybegynder
21. april 2008 - 17:21 #8
Super duper....

Vil i begge lægge et svar, så kan i dele i porten?
Avatar billede olebole Juniormester
21. april 2008 - 22:31 #9
- svar  =)
Avatar billede jokkejensen Novice
22. april 2008 - 10:47 #10
mit var vist mere offtopic.. stik bare ole points for at besvare egentligt spm.

vh. JJ
Avatar billede viggosmor Nybegynder
22. april 2008 - 16:22 #11
oki doki, hermed givet point til ole... :)
Avatar billede olebole Juniormester
22. april 2008 - 20:03 #12
Jamen, så takker jeg ... Jer begge  ;o)
Avatar billede viggosmor Nybegynder
27. april 2008 - 17:58 #13
Vi havde store problemer med vores site, rent css mæssigt og har fået noget hjælp på et andet forum, meeen i den kode jeg har fået, er der ikke taget højde for at fjernsynene skal skifte, når man trykker på thumbnailse..

Har siddet og rodet med det et par timer nu, men kan ikke få det til at fungere med den nye css og html kode...

Siden er her:

http://soederberg-webdesign.dk/exellenceTest/index.php

Hvordan gør jeg det smartest?
Avatar billede viggosmor Nybegynder
27. april 2008 - 18:07 #14
Je vil godt give extra point 100 stk....
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