Søg
Avatar billede Slettet bruger
14. februar 2006 - 15:24 Der er 42 kommentarer og
1 løsning

JavaScript som får et billede frem når man har musen over teksen

Hej!
Er der nogen der kender et javascript, hvor der kommer et billede frem når man holder musen over en tekst.
Avatar billede lsskaarup Nybegynder
14. februar 2006 - 15:27 #1
se f.eks. http://www.eksperten.dk/spm/681955
Avatar billede roenving Novice
14. februar 2006 - 15:29 #2
Hvordan komme frem ?-)

-- er det et fikseret sted på siden, hvor der skal vises et billede, eller skal det komme frem, hvor cursoren står ?o]

-- til det sidste kan overLib anbefales: http://www.bosrup.com/web/overlib/ !-)
Avatar billede Slettet bruger
14. februar 2006 - 15:32 #3
Det skal komme frem når cursoren er over teksten
Avatar billede roenving Novice
14. februar 2006 - 15:34 #4
Hvor ...
Avatar billede Slettet bruger
14. februar 2006 - 15:35 #5
Ved siden ad
Avatar billede Slettet bruger
14. februar 2006 - 15:35 #6
fikseret sted på siden
Avatar billede Slettet bruger
14. februar 2006 - 15:43 #7
Eksempel: I venstre side af siden er der et stort billede. Ved siden af er der noget tekst. Når man så holder cursoren over teksten, skrifter billedet.
Avatar billede Slettet bruger
14. februar 2006 - 16:03 #8
Kan jeg ikke snart få et svar?? Skal helst bruge det inden 17
Avatar billede Slettet bruger
14. februar 2006 - 16:09 #9
Ligger 60 point oven i.
Avatar billede roenving Novice
14. februar 2006 - 16:10 #10
F.eks.

<span onmouseover="document.getElementById('billede').src='billede1.jpg';">En tekst, der viser et billede</span>

-- så skal billedet have et id, der svarer til det brugte:

<img id="billede" ...
Avatar billede Slettet bruger
14. februar 2006 - 16:10 #11
Jep
Avatar billede Slettet bruger
14. februar 2006 - 16:18 #12
Kan du ikke lige skrive det hele? Er ikke så god til javascript.
Avatar billede Slettet bruger
14. februar 2006 - 16:18 #13
Og så ligge et svar
Avatar billede roenving Novice
14. februar 2006 - 16:22 #14
Der skal ikke være mere, men billedernes filstier skal selvfølgelig skrives i stedet for 'billede1.jpg' !-)
Avatar billede Slettet bruger
14. februar 2006 - 16:24 #15
Har et lille problem:

<span onmouseover="document.getElementById('billede').src='billede1.jpg';" name="billede">Test</span> <img id="billede" height="150" width="500" scr="billede 2.jpg">

Billedet der er der først vil ikke komme frem?
Avatar billede Slettet bruger
14. februar 2006 - 16:26 #16
EDIT: Havde mellemrum mellem billede og 2.

Lig lige et svar
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 16:26 #17
Det er dit img-tag, der skal have navnet/id'et billede - ikke dit span-tag.
se  roenving 14/02-2006 16:10:03
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 16:28 #18
Slet name="billede" i dit span-tag
Avatar billede roenving Novice
14. februar 2006 - 16:28 #19
Velbekomme '-)
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 16:30 #20
Forresten er det en god ide, at loade billederne i et image før musen køres henover. Herved skifter billedet med det samme, når du kører musen henover. Jeg kan godt poste et lille script til det, hvis du er interesseret..
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 16:46 #21
<html>
<head>
<script type="text/javascript" language="javascript">
if (document.images) {

  pic1_1 = new Image();
  pic1_1.src = "billede1.jpg";

  pic1_2 = new Image();
  pic1_2.src = "billede2.jpg";
}
function skiftBillede(Id,Sti) {
if (document.images) {
  document.getElementById(Id).src = eval(Sti + ".src");
  }
}
</script>
</head>
<body>
<span onmouseover = "skiftBillede('pic1','pic1_2')" onmouseout = "skiftBillede('pic1','pic1_1')">hej hej</span>
<img src="billede1.jpg" id="pic1" width="150" height="200">
</body>
</html>
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 16:47 #22
Brug det jeg skrev.. Virker meget bedre - specielt hvis den der kigger har en lidt langsom forbindelse.
Avatar billede roenving Novice
14. februar 2006 - 16:51 #23
-- hvadfor har du en eval med ???
Avatar billede Slettet bruger
14. februar 2006 - 16:52 #24
Øm... Er det okay i deler pointene? For cyberjelle har jo også svaret.
Og hvad med de andre 60? Skal de også deles?

Tak til begge to!
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 16:59 #25
Kommer da an på hvilken en du bruger...
Jeg vil ikke have points, hvis du kan nøjes med hans.
Avatar billede Slettet bruger
14. februar 2006 - 17:01 #26
Ok.
Cyberjelle kan du lave et eksempel hvor der er to tekster men det samme billede der skrifter?
Avatar billede Slettet bruger
14. februar 2006 - 17:03 #27
Ups... Klokkede i det!
Avatar billede roenving Novice
14. februar 2006 - 17:03 #28
-- men jeg er absolut uenig med cyberjelle om, at det er meget bedre ...

-- han sætter een ny ting ind (og svarer forøvrigt på mere, end der er spurgt om !-)

-- preloaderen kan ganske rigtigt betyde, at nogle brugere, som har indstillet deres browser til at genbruge fra browserens cache, vil få det en smule hurtigere (og hvis de så har en meget lille forbindelse kan det ganske rigtigt komme til at betyde noget !-), de fleste, der har indstillet browseren til at vise det nyeste hvergang, vil ikke opleve nogen forskel !-)

-- og så er det absolut tåbeligt at henvise til et object ved at overføre navnet og så ved hjælp af eval få det tilbage, hvorfor ikke bare bruge objektet selv ?-)

-- det svarer sådan til, at jeg tager en kop varm kaffe og fyser den ned før jeg rækker den til dig, så du for at drikke den først må tø den og varme den op til drikketemperatur, lidt tåbeligt, hvis vi alligevel sidder i samme rum !o]

-- og hvis du vil have flere point i et spørgsmål, kan du oppe til venstre under Funktioner finde punktet "Afsæt flere point" i et åbent spørgsmål !-)
Avatar billede Slettet bruger
14. februar 2006 - 17:05 #29
Undskyld...
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:07 #30
Ellers bliver "sti" og ".src" ikke lagt sammen.
Man kunne også have skrevet:
skiftBillede('pic1','pic1_2.src')
i events'ne.
Avatar billede Slettet bruger
14. februar 2006 - 17:10 #31
Er der noget jeg kan gøre ved det?
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:15 #32
->roenving:
Det handler ikke bare om at svare på udelukkende det der bliver spurgt om, men om at hjælpe hinanden så meget som jeg nu kan (bare min mening). Derfor kan jeg ligeså godt lave det ordentligt for ham.
Hvis man ikke preloader billederne vil det have en STOR effekt. Billederne kommer altså bare ikke med det samme. Sådan er det - det kan godt være det kun er sådan den først gang. Men det er der.

back2dicito: Hvis roenving så utroligt gerne vil have de points, synes jeg bare du skal give dem til ham. (selvom hans argumenter ikke holder en meter - kunne ikke lade være)
Jeg gider vil gerne hjælpe dig med resten.
Er ligeglad med pointene.
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:16 #33
(-gider)
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:16 #34
Skal det være to forskellige billeder?
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:19 #35
Jeg omformulerer lige...

Skal det være det samme billede, der skifter til et andet, eller tredje, alt efter hvilken text man holder musen over
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:23 #36
Hvis det var tilfældet er koden her:

<html>
<head>
<script type="text/javascript" language="javascript">
if (document.images) {

  pic1 = new Image();
  pic1.src = "billede1.jpg";

  pic2 = new Image();
  pic2.src = "billede2.jpg";

  pic3 = new Image();
  pic3.src = "billede3.jpg";
}
function skiftBillede(Id,Sti) {
if (document.images) {
  document.getElementById(Id).src = eval(Sti + ".src");
  }
}
</script>
</head>
<body>

<span onmouseover = "skiftBillede('pic','pic2')" onmouseout = "skiftBillede('pic','pic1')">billede2</span><br>
<span onmouseover = "skiftBillede('pic','pic3')" onmouseout = "skiftBillede('pic','pic3')">billede3</span><br>
<img src="billede1.jpg" id="pic" width="150" height="200">

</body>
</html>
Avatar billede roenving Novice
14. februar 2006 - 17:25 #37
Hvorfor skriver du ikke bare:

skiftBillede('pic1',pic1_2);

-- og

document.getElementById(Id).src = Sti.src;
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:30 #38
For at opdatere html'en skal document.getElementById(Id).src fodres med en streng.
I dette tilfælde "picX.src"
Avatar billede Slettet bruger
14. februar 2006 - 17:35 #39
Ok, tak!
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:37 #40
Det var så lidt...
Håber både din dag og pointliderlige roenvings dag er reddet ;)
Avatar billede roenving Novice
14. februar 2006 - 17:43 #41
Og det ligger Sti.src, hvis du kalder med skiftBillede('pic',pic1)>
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:49 #42
JA... Det har du ret i. Sorry, hvis vi snakkede forbi hinanden
Avatar billede cyberjelle Nybegynder
14. februar 2006 - 17:57 #43
-> dicito

Du kan give mig lidt karma i stedet for points. Trænger til det ;-)
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 10:05 Sætte flere billeder sammen til et billede - IPad seneste version Af nu_igen i Billedbehandling
I går 14:56 Udseende af datoer Af ErikHg i Excel
23/0509:37 hvilken AI synes I er bedst? Af jcr18 i Andre onlineløsninger
22/0518:51 Pausepil på youtube i chrome Af valby i Browsere
22/0511:42 Mail med endelsen ".lat" Af ErikHg i E-mail
White papers
Flere white papers »