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

sigkai Nybegynder

28. december 2005 - 21:26 Der er 26 kommentarer og
1 løsning

Billed følge med

Hej
På min hjemmeside har jeg et javascript,som gør at når man klikker på et lille billede, bliver det vist i stort øverst til højre på siden. Mit problem er nu, at hvis man er scrolled ned på siden bliver det stadig vist øverst på siden, og så kan man ikke se det. Jeg vil gerne kunne lave det sådan at det altid bliver vist midt på skærmen ude til højre..... Er der nogen der kan hjælpe mig med dette?????
PLease:o)
Mange hilsner
signe

Synes godt om

thesurfer Nybegynder

28. december 2005 - 21:38 #1

1) Smid lige koden her ind, så vi har noget at arbejde med..

2) Scriptet bruger garanteret position:absolut..

Men se punkt 1.

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 21:52 #2

<SCRIPT LANGUAGE=JavaScript>
Java scriptet ser sådan ud:

var srcElement
function Stor(){
srcElement = window.event.srcElement;
blank.src="design/stof/" + srcElement.kollek + "/" + srcElement.id"_s.jpg";
opl.innerHTML="Pris " + srcElement.price + " dkk pr. meter Varenr: " + srcElement.name + " Kollektion:"+ srcElement.kollek + " Bredde:";
}
</script>

Der hvor jeg så vil have vist det store billede har jeg sat følgende tags ind: <img border="0" src="design/tilbud1.jpg" id="blank" class="billede" width="247" height="165" > 

Hvis det kan gøres lettere, så er forslag meget velkomne.... :O)

Signe

Synes godt om

thesurfer Nybegynder

28. december 2005 - 22:00 #3

Kig i din ".css" fil.. der skulle gerne så

.billede {
...
}

Hvor "..." er noget css-kode..

Koden kan enten stå i selve filen, i en style blok:

<style type="text/css">
css-kode-står-her
</style>

eller i ekstern fil.. så vil der stå noget i stil med:

<link rel="stylesheet" href="navnet-på-filen.css" type="text/css">

Den sidste metode, vil du kunne finde imellem <head> og </head> tagsne i din fil
(hvis strukturen er iorden)

/theSurfer

Synes godt om

thesurfer Nybegynder

28. december 2005 - 22:02 #4

Der er en fejl i scriptet.. der mangler et plus ("+") lige før: "_s.jpg";

Det skal se sådan ud:

blank.src = "design/stof/" + srcElement.kollek + "/" + srcElement.id + "_s.jpg";

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 22:07 #5

yep ... der står

#billede {position:fixed; left:0px; width:247px; top:0px; height:165px;}

Synes godt om

thesurfer Nybegynder

28. december 2005 - 22:18 #6

Prøv at fjerne "postion:fixed" eller erstat det med "position:relative"..

hmm.. der står "left:0px" (og "top:0px").. hvilket betyder øverste venstre hjørne.. du skrev højre..?

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 22:23 #7

ja det er fordi det vises der hvor har sat HTML taget ind.... Hvordan ophæver jeg dette så jeg kan placere billedet ved hjælp af #billede i css-koden ???

Synes godt om

thesurfer Nybegynder

28. december 2005 - 22:26 #8

Hvis du fjerner class="billede" fra <img ...>, burde du kunne placere billedet hvor du vil..

class="billede" kalder på css-koden, der placerer billedet, ved koordinaterne (0,0) = øverste venstre hjørne..

/theSurfer

Synes godt om

thesurfer Nybegynder

28. december 2005 - 22:27 #9

Du burde ændre " blank.src= ..." linie til:

document.getElementById("blank").src = ...

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 22:28 #10

hmmm mit problem er lige netop at det ikke placeres ved (0,0) men der hvor jeg har sat <img> target ind i min frame.

Synes godt om

thesurfer Nybegynder

28. december 2005 - 22:42 #11

Nu er jeg lidt forvirret..

Skal billedet placeres i (0,0)? Eller skal billedet placeres, hvor du placerer <img> tag'et?

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 22:48 #12

hej nu kan jeg placere billedet hvor jeg vil .... tak :o) Men jeg har stadig problemer med at når jeg scroller ned på siden og trykker på et nyt billede, så kommer det til stå på øverste side. Dvs det er "bundet" til html sidn og ikke ti placeringen på skærmen... Har du en løsningen til dette ?
signe :o)

Synes godt om

thesurfer Nybegynder

28. december 2005 - 23:08 #13

Doh! Det var mig der sov..

det skal jo være ".billede", og ikke "#billede"..

Eksempel:
<style type="text/css">
.billede {position:fixed;}
</style>

.... html kode ...

<img src="billede.jpg" class="billede">

... html kode der fylder mange linier, så man kan scroll ..
og en masse:
 
 
 
 
 
 
 
 

osv..

:-)

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 23:18 #14

god ide, men hvis jeg så kører op på siden igen... så bliver det jo nede :o) Det er ikke helt let..

Synes godt om

thesurfer Nybegynder

28. december 2005 - 23:28 #15

eh..?
Billedet bliver, hvor det blev sat.. :-)
Det er lige meget om du scroller op eller ned.. :-)

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 23:31 #16

ja, billedet følger ikke med... kan man lave det sådan at billede følger med når jeg scroller . Jeg ved jeg er krævende :o)

Synes godt om

thesurfer Nybegynder

28. december 2005 - 23:42 #17

Ahhh.. hehe.. nu forstår jeg det :-)

Så skal vi ud i noget JavaScript.. kigger lige på det..

/theSurfer

Synes godt om

sigkai Nybegynder

28. december 2005 - 23:44 #18

tak :o)...

Synes godt om

thesurfer Nybegynder

29. december 2005 - 00:46 #19

Undskyld forsinkelsen.. havde noget ved siden af..

Men scriptet er sådan set simpelt.. sig til, hvis der er noget jeg skal forklare..

<script language="javascript">
function vis(img)
{
var b = document.getElementById("beholder");
b.src = img;
b.style.top = document.body.clientHeight / 2 - b.height / 2 + "px";
b.style.left = document.body.clientWidth - b.width + "px";
b.style.display = "";
}
</script>


<img src="" id="beholder" style="display:none;position:fixed;z-index:5000">

noget tekst og et billede:
<img src="lille_billede.jpg" onclick="vis('stort_billede.jpg')">
 
noget mere tekst og et billede mere:
<img src="lille_billede_nummer_2.jpg" onclick="vis('stort_billede_nummer_2.jpg')">

 
 
 
 
noget tekst i bunden af siden..

/theSurfer

Synes godt om

thesurfer Nybegynder

29. december 2005 - 00:47 #20

Ahhh.. så skrev jeg det alligevel..

I gamle dage hed det: language="JavaScript"

I dag hedder det: type="text/JavaScript"

Men language understøttes stadigvæk..

/theSurfer

Synes godt om

thesurfer Nybegynder

29. december 2005 - 00:53 #21

Her er koden igen.. denne gang med kommentarer der forklare koden:

<script type="text/JavaScript">
// dette er en funktion, der tager 1 parameret med,
// nemlig stien til det billede der skal vises:
function vis(img)
{

// sæt beholder i variablen "b":
var b = document.getElementById("beholder");

// sæt b's kilde/sti til den vi sender med:
b.src = img;

// sæt b's topkoordinat til body-højdens midtpunkt, og trækker b's midtpunkt fra = center:
b.style.top = document.body.clientHeight / 2 - b.height / 2 + "px";

// sætt b's venstrekoordinat til body-bredden minus b's bredde = helt over i siden:
b.style.left = document.body.clientWidth - b.width + "px";

// vis beholderen, der jo starter med at være skjult:
b.style.display = "";
}
</script>


<img src="" id="beholder" style="display:none;position:fixed;z-index:5000">

noget tekst og et billede:
<img src="lille_billede.jpg" onclick="vis('stort_billede.jpg')">
 
noget mere tekst og et billede mere:
<img src="lille_billede_nummer_2.jpg" onclick="vis('stort_billede_nummer_2.jpg')">

 
 
 
 
noget tekst i bunden af siden..

/theSurfer

Synes godt om

thesurfer Nybegynder

29. december 2005 - 00:54 #22

Jeg smider lige et svar.. smutter snart i seng..

/theSurfer

Synes godt om

sigkai Nybegynder

29. december 2005 - 10:05 #23

tak for hjælpen.... det virker _.o)

Synes godt om

sigkai Nybegynder

29. december 2005 - 10:07 #24

jeg kan ikke å lov at acceptere dit svar.... prøver du lige igen

Synes godt om

thesurfer Nybegynder

29. december 2005 - 11:50 #25

Du skal bare markere mit navn i boksen først, og derefter klikke på Accepter.

Læs venligst http://expfaq.1go.dk , hvor der står en masse herlige ting om Eksperten :-)
(ved at læse FAQ'en, undgår du at træde folk over tæerne)

/theSurfer

Synes godt om

sigkai Nybegynder

29. december 2005 - 20:44 #26

så virkede det :o) jeg har brugt det før, og synes jeg gjorde det rigtige, men det er et stykke tid siden. Jeg selv har stillet et spørgsmål

Synes godt om

thesurfer Nybegynder

29. december 2005 - 21:52 #27

Det passer fint..
Da de opdaterede Eksperten til version 4 (nuværende version), fjernede de muligheden for bare at klikke på Accepter-knappen.
Nu *skal* man markere et navn, også selvom der kun er 1 navn i boksen..

Det skulle man ikke før.. men skal det nu..

/theSurfer

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

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	17	10/09/202515:07	10/09/202519:19
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

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