/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Imageswap med en IF-sætning
Fra : AllanE


Dato : 05-06-02 09:01

Er der en der kan hjælpe mig med at lave et simpelt script der skifter
billede 1 til billede 2, når der klikkes på det og omvendt.

Helt konkret skal jeg lave en "fold-ud" funktion med et Plus og Minus hhv.
når teksten er foldet ind og ud. Når der klikkes på plusset folder teksten
sig ud og plusset skal skifte til minus. Det skal kun virke til IE5.5 og op,
så det må næsten kunne laves på få linjer?

På forhånd tak.

-AllanE



 
 
Knud Gert Ellentoft (05-06-2002)
Kommentar
Fra : Knud Gert Ellentoft


Dato : 05-06-02 09:25

Wed, 5 Jun 2002 10:01:21 +0200, skrev "AllanE"
<elsted@NO-SPAM.postkasse.com>:

>Er der en der kan hjælpe mig med at lave et simpelt script der skifter
>billede 1 til billede 2, når der klikkes på det og omvendt.

Hvis det skal være simpelt, tror jeg det er svært med onClick, du
kan ikke bruge et med onMouseover?

Så følger det her:
<html>
<head>
<script language="javascript">
<!-- Skjul for gamle browsere

imageIn = new Image(256, 256);
imageOut = new Image(256, 256);
imageIn.src="1.JPG";
imageOut.src="2.JPG";

function swapImageIn()
{
document.imageToSwap.src=imageIn.src;
}

function swapImageOut()
{
document.imageToSwap.src=imageOut.src;
}
//Slut skjul -->
</script>
</head>
<body>
<a href="#" onMouseover="swapImageIn()"
onMouseout="swapImageOut()"><img src="1.JPG" width=256 height=256
name="imageToSwap"></a>
</body>
</html>

Fut: news:dk.edb.internet.webdesign.clientside, hvor
scriptspørgsmål hører hjemme og svar herpå bringes.
--
Knud - http://home13.inet.tele.dk/smedpark/
Når der svares på et indlæg, svar venligst under det citerede og
skær venligst det væk, du ikke svarer på, ellers ryger du i killfiltret.
Svar kun i nyhedsgruppen - tak! E-mails besvares ikke.

AllanE (05-06-2002)
Kommentar
Fra : AllanE


Dato : 05-06-02 09:55

FUT'et hertil fra dk.edb.internet.webdesign.html:



"Knud Gert Ellentoft" <knudgert@mail.tele.dk> skrev i en meddelelse
news:2eirfuofj9io439ib3su74k88s7ljm3e87@dtext.news.tele.dk...
> Wed, 5 Jun 2002 10:01:21 +0200, skrev "AllanE"
> <elsted@NO-SPAM.postkasse.com>:
>
>>Er der en der kan hjælpe mig med at lave et simpelt script der skifter
>>billede 1 til billede 2, når der klikkes på det og omvendt.
>>
>>Helt konkret skal jeg lave en "fold-ud" funktion med et Plus og Minus hhv.
>>når teksten er foldet ind og ud. Når der klikkes på plusset folder teksten
>>sig ud og plusset skal skifte til minus. Det skal kun virke til IE5.5 og
op,
>>så det må næsten kunne laves på få linjer?

>>På forhånd tak.

>>-AllanE
>
> Hvis det skal være simpelt, tror jeg det er svært med onClick, du
> kan ikke bruge et med onMouseover?
>
> Så følger det her:
> <html>
> <head>
> <script language="javascript">
> <!-- Skjul for gamle browsere
>
> imageIn = new Image(256, 256);
> imageOut = new Image(256, 256);
> imageIn.src="1.JPG";
> imageOut.src="2.JPG";
>
> function swapImageIn()
> {
> document.imageToSwap.src=imageIn.src;
> }
>
> function swapImageOut()
> {
> document.imageToSwap.src=imageOut.src;
> }
> //Slut skjul -->
> </script>
> </head>
> <body>
> <a href="#" onMouseover="swapImageIn()"
> onMouseout="swapImageOut()"><img src="1.JPG" width=256 height=256
> name="imageToSwap"></a>
> </body>
> </html>
>
> Fut: news:dk.edb.internet.webdesign.clientside, hvor
> scriptspørgsmål hører hjemme og svar herpå bringes.
> --



Nej, det skal kunne bruges med onClick...

-AllanE



Knud Gert Ellentoft (05-06-2002)
Kommentar
Fra : Knud Gert Ellentoft


Dato : 05-06-02 10:49

Wed, 5 Jun 2002 10:55:26 +0200, skrev "AllanE"
<elsted@NO-SPAM.postkasse.com>:

>Nej, det skal kunne bruges med onClick...

Det bliver en svær en, jeg ved ikke lige, hvordan man skal kunne
lave to onClickhandlinger samme sted.

Det er ikke svært at lave et billedskift med onClick, men at gå
tilbage til billede 1 også med onClick, det er det svære.

Jeg har prøvet at søge på google og jeg kan ikke finde noget
script, der kan klare det, når det er billedet, der skal være
klikbart.
Det er let nok med, hvis funktionen må flyttes op i et par
knapper/links.

PS. Når du svarer på et indlæg, så må du meget gerne klippe i det
du svarer på, der var f.eks. ingen grund til at medsende hele mit
svar incl. signatur.

med venlig hilsen
Knud
--
Når der svares på et indlæg, svar venligst under det citerede
og skær venligst det væk, du ikke svarer på.
Du kan læse mere om de danske nyhedsgrupper på http://www.usenet.dk
http://home13.inet.tele.dk/smedpark

Henrik Lynggaard (05-06-2002)
Kommentar
Fra : Henrik Lynggaard


Dato : 05-06-02 12:08

AllanE wrote:
> FUT'et hertil fra dk.edb.internet.webdesign.html:
>
> Nej, det skal kunne bruges med onClick...


Prøv det her:

<html>
<head>
<script language="javascript">

imageIn = new Image(9, 9);
imageOut = new Image(9, 9);
imageIn.src="images/plus.gif";
imageOut.src="images/minus.gif";

function swapImage()
{
if (document.imageToSwap.src==imageIn.src)
{
document.imageToSwap.src=imageOut.src;
}
else
{
document.imageToSwap.src=imageIn.src;
}
}
</script>
<title>test 2</title>

</head>
<body>
<a href="#" onclick="swapImage()"><img src="images/plus.gif"
width="256" height="256" name="imageToSwap">
</a>
</body>
</html>


AllanE (05-06-2002)
Kommentar
Fra : AllanE


Dato : 05-06-02 15:04

PERFEKT!!! Det virker!

Bare af nysgerrighed: Hvad gør de første linjer (imageIn = new Image(9, 9) &
imageOut = new Image(9, 9))?

Tak for hjælpen.

-AllanE



AllanE (05-06-2002)
Kommentar
Fra : AllanE


Dato : 05-06-02 15:18

Kan du evt. også vise hvordan man gør den dynamisk, så jeg kan have flere
"Plus/minus" på siden? Kan man f.eks. kalde funktionen
"swapImage(ImageNavn)", og så angive billedets navn når funktionen kaldes?
Jeg kan ikke selv få det til at virke, men håber at du eller en af jer andre
kan...

-AllanE



Henrik Lynggaard (05-06-2002)
Kommentar
Fra : Henrik Lynggaard


Dato : 05-06-02 16:50



AllanE wrote:
> Kan du evt. også vise hvordan man gør den dynamisk, så jeg kan have flere
> "Plus/minus" på siden? Kan man f.eks. kalde funktionen
> "swapImage(ImageNavn)", og så angive billedets navn når funktionen kaldes?
> Jeg kan ikke selv få det til at virke, men håber at du eller en af jer andre
> kan...


Prøv med noget i denne retning (den her kan du også angive hvad
billedfilen skal starte med)

<html>
<head>
<script language="javascript">

function swapImage(imgname,filePrefix)
{
/* opret to tomme billed elementer/objecter */
var imageIn = new Image(9, 9);
var imageOut = new Image(9, 9);

/* bliver referencen til vores img tag */
var imageElement;

/* preload billederne der skal skiftes imellem */
imageIn.src= "images/"+filePrefix + "_in.gif";
imageOut.src="images/"+filePrefix + "_out.gif"

/* vi er nød til at gå igennem eval for at sætte imageElement,
vi kunne alternativt bruge document.getElementById(imgname); men
det virker kun i nyere browsere */

eval("imageElement = document."+imgname);

/* lav skiftet */
if (imageElement.src==imageIn.src)
{
imageElement.src=imageOut.src;
}
else
{
imageElement.src=imageIn.src;
}
}
</script>
<title>test 2</title>
</head>
<body>
<a href="#" onclick="swapImage('imageToSwap','icon')"><img
src="images/icon_in.gif"
width="256" height="256" name="imageToSwap"></a>
<br>
</body>
</html>

mvh
henrik


AllanE (05-06-2002)
Kommentar
Fra : AllanE


Dato : 05-06-02 20:08

Tusind tak for hjælpen, Henrik! Det virker perfekt nu.

-AllanE



Søg
Reklame
Statistik
Spørgsmål : 177511
Tips : 31968
Nyheder : 719565
Indlæg : 6408596
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste