Søg
Avatar billede Skynet Mester
06. september 2004 - 17:20 Der er 15 kommentarer og
2 løsninger

Rollover, hvor et andet billede skifter?

Hej

er der nogen som der har en kode som denne rollover:
http://www.acmemade.com/bags.html

jeg kunne naturligvis bare kopoiere koden fra overstående link, men jeg synes at koden er svær at gennemskue..

det er vitigt at billede bliver der, også efter at man tager musen væk, og at billede først skifter når man tager musen over et nyt billede

mvh Silas
Avatar billede jakobclausen Nybegynder
06. september 2004 - 17:26 #1
Run: http://www.viewsource.dk/javascripts/Imageseffects/Multiimagechange/Multiimagechange.htm

Download: http://www.viewsource.dk/dwl.asp?ID=131&ident=js

HVor du jo sikkert kun skal bruge ét billede der skifter!
Avatar billede jakobclausen Nybegynder
06. september 2004 - 17:30 #2
Angående at billedet skal blive stående når du fjerner musen - der skal du bare slette mouseOut på billedet
Avatar billede jakobclausen Nybegynder
06. september 2004 - 17:47 #3
Tjek: www.bokaj.dk/eksperten/536826/index.htm
Avatar billede Skynet Mester
06. september 2004 - 17:52 #4
tak for de gode svar... men jeg mangler blot at der også skal skifte et hyperlink med det nye billede

<html>
<head>
<title>JavaScripts - Images Effects - Multi Image Change</title>

<script LANGUAGE="JavaScript">
<!-- Original:  Benjamin Wright, Editor -->

<!-- Begin
// Preload Images
var image0 = new Image(); image0.src = "move2.gif";
var image1 = new Image(); image1.src = "3.gif";
var image2 = new Image(); image2.src = "4.gif";
//  End -->
</script>
</head>
<body>

<img src="move2.gif" name="image0"><br>
<hr>
<a href="www.tv1.dk" onmouseover="image0.src='1.gif';"><img name="image1" src="1.gif" WIDTH="80" HEIGHT="80" border="1"></a>
<a href="www.tv2.dk" onmouseover="image0.src='2.gif';"><img name="image2" src="2.gif" border="1" WIDTH="80" HEIGHT="80"></a>
<a href="www.tv3.dk" onmouseover="image0.src='3.gif';"><img name="image3" src="3.gif" border="1" WIDTH="80" HEIGHT="80"></a>


       
     
</body>
</html>
Avatar billede roenving Novice
06. september 2004 - 18:24 #5
-- og så måske, for at være sikker på, at hverken browsere bliver forvirret over den gentagne brug af det samme variabelnavn eller står af, fordi de ikke kender et javascript-objekt, som hedder image0 ...

-- og selvfølgelig inklusive link-skifteren:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Skift billede og link</title>

<script language="JavaScript">
var actLink = links[0];
var imgs = new Array();
imgs[0] = new Image(); imgs[0].src = "move2.gif";
imgs[1] = new Image(); imgs[1].src = "3.gif";
imgs[2] = new Image(); imgs[2].src = "4.gif";
var links = new Array();
links[0] = "http://www.etLink.dk";
links[1] = "http://www.etAndetLink.dk";
links[2] = "http://www.etTredjeLink.dk";
var actLink = links[0];

function changeImg(num){
  document.images['image0'].src = imgs[num].src;
  actLink = links[num];
}
</script>
</head>
<body>

<img src="move2.gif" name="image0" onclick="location.href=actLink;"><br>
<hr>
<img name="image1" src="1.gif" width="80" height="80" border="1" onmouseover="changeImg(0);">
<img name="image2" src="2.gif" border="1" width="80" height="80" onmouseover="changeImg(1);">
<img name="image3" src="3.gif" border="1" width="80" height="80" onmouseover="changeImg(2);">

</body>
</html>
Avatar billede roenving Novice
06. september 2004 - 18:26 #6
-- Hov, jeg fik ikke fjernet den første linje med
var actLink,
-- så det må du lige selv gøre !-)
Avatar billede Skynet Mester
07. september 2004 - 12:36 #7
hej, tak for det

jeg vil gerne give jer begge point, så roenvig du kan jo lige lave et svar..

har lige et spørgsmål: hvordan sætter man target som ex. _self

var links = new Array();
links[0] = "http://www.etLink.dk";
links[1] = "http://www.etAndetLink.dk";
links[2] = "http://www.etTredjeLink.dk";
Avatar billede roenving Novice
07. september 2004 - 12:39 #8
Det gør du på img-tagget !-)

-- men hvis du skal have forskellige bliver det en smule krøllet ...

location.href svarer til target="_self", i en iframe på siden skulle det være:

window.frames['iframeName'].location.href ...

-- og velbekomme '-)
Avatar billede Skynet Mester
07. september 2004 - 13:28 #9
Hej, det forstår jeg ikke helt, kan du ikke lige sætte det ind, alle links skal åbne i et nyt vindue. mvh Silas


<html>
<head>
<title>Skift billede og link</title>

<script language="JavaScript">

var imgs = new Array();
imgs[0] = new Image(); imgs[0].src = "move2.gif";
imgs[1] = new Image(); imgs[1].src = "3.gif";
imgs[2] = new Image(); imgs[2].src = "4.gif";

var links = new Array();
links[0] = "http://www.etLink.dk";
links[1] = "http://www.etAndetLink.dk";
links[2] = "http://www.etTredjeLink.dk";

var actLink = links[0];

function changeImg(num){
  document.images['image0'].src = imgs[num].src;
  actLink = links[num];
}
</script>
</head>
<body>

<img src="move2.gif" name="image0" onclick="location.href=actLink;"><br>
<hr>
<img name="image1" src="1.gif" width="80" height="80" border="1" onmouseover="changeImg(0);">
<img name="image2" src="2.gif" border="1" width="80" height="80" onmouseover="changeImg(1);">
<img name="image3" src="3.gif" border="1" width="80" height="80" onmouseover="changeImg(2);">

</body>
</html>
Avatar billede roenving Novice
07. september 2004 - 13:39 #10
-- altså det, som svarer til target="_blank" ?-)

<img src="move2.gif" name="image0" onclick="window.open(actLink,'presentation');"><br>
Avatar billede Skynet Mester
07. september 2004 - 13:47 #11
tak for det, jeg har lige tilføjet
<a href="#"><img src="move2.gif" name="image0" onclick="window.open(actLink,'presentation');"></a><br>

så der kommer en hånd, som viser brugeren at der er tale om et hyperlink....

Mvh Silas
Avatar billede roenving Novice
07. september 2004 - 13:50 #12
Det klarer du nemmere (og smartere !-) med:

<img src="move2.gif" name="image0" onclick="window.open(actLink,'presentation');" style="cursor:pointer;"><br>

-- ellers skal vi nemlig til at gøre noget ved linket, så siden ikke reloader, når man klikker !o]

-- og tak for point ;~}
Avatar billede Skynet Mester
03. oktober 2004 - 22:12 #13
Hey igen

jeg vil gerne udvide scriptet lidt, så at det nye vindue åbner som et js, vindue: her er koderne som jeg gerne vil have aktiveret.


i head

    <script type="text/javascript">
<!-- Dette script og mange flere -->
<!-- findes hos http://www.html.dk -->
<!-- Start

function popup(url,name,win_height,win_width) {
    pos_horizon = ((screen.width/2)-(win_width/2));
    pos_vertical = ((screen.height/2)-(win_height/2));
    window.open(url,name,"width="+win_width+",height="+win_height+",top="+pos_vertical+",left="+pos_horizon);
    }

// Slut -->
</script>

og som link

<a href="#" onclick="popup('popup.asp','mitvindue','500','700');">Åben popup vindue</a>


Er det muligt at flette noget pop op som dette ind, istedet for det nuværende normale hyperlink.

Mvh Silas
Avatar billede roenving Novice
03. oktober 2004 - 23:13 #14
<img src="move2.gif" name="image0" onclick=popup(actLink,'presentation',500,700);" style="cursor:pointer;"><br>
Avatar billede Skynet Mester
04. oktober 2004 - 12:02 #15
yes det virker... jeg ville egentelig også gerne have de små billeder til at være links

<td><img name="image1" src="billeder/g1r.jpg" height="87" width="87" border="0" onmouseover="changeImg(0);"></td>

skal flettes sammen med onclick=popup(actLink,'presentation',500,700);

kan du også klare det?

Mvh Silas
Avatar billede roenving Novice
04. oktober 2004 - 17:25 #16
Du skriver det samme i img-tagget som i a-tagget !-)

<td><img name="image1" src="billeder/g1r.jpg" height="87" width="87" border="0" onmouseover="changeImg(0);" onclick=popup(actLink,'presentation',500,700);"></td>
Avatar billede Skynet Mester
04. oktober 2004 - 19:27 #17
tak for det

Personen som jeg laver hjemmesiden bruger mac, og har testet det på de forskellige typer browsere, hun oplever nogle små problemer med nogle af de andre typer browsere. Er der noget man kan ændre i scriptet så at alle kan være med, og ikke kun IE?

Mvh Silas
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 går 17:10 Windows 10 Home 22H2 produktnøgle Af Uvanga i Windows
I går 17:10 Windows 10 Home 22H2 produktnøgle Af Uvanga i Windows
05/0810:19 Kan jeg beholde Publisher på min maskine efter at MS stopper med support Af KurtG i Office & Kontorpakker
02/0814:53 TV4ever 3.0 Af valby i Diverse
01/0816:21 Installere Ubuntu på Virtuel Maskine Af Uvanga i Andet software
White papers
Flere white papers »