Søg
Avatar billede thinkfast Nybegynder
16. september 2003 - 22:52 Der er 14 kommentarer og
1 løsning

Javascript hjælp!

Hej allesammen jeg bruger denne kode:

<script type="text/javascript">

t = [3,47,91,135];
l = [3,47,91,135];

function moveImage(num){
num = parseInt(num,10);
lnum = (num-1)%4;
tnum = Math.floor((num-1)/4);
document.images['image'].style.left = l[lnum];
document.images['image'].style.top = t[tnum];
}

</script>
<img src=floor.gif name=pic2 onclick=moveImage(this.name.substring(3)); width=40 height=40 border=0>

til at rykke min figur på:
http://rpg.users.whitehat.dk/felt/index.php?navn=Eksperten

Men istedet for at den rykker "manden" over ved hjælp af kordinater:
t = [3,47,91,135];
l = [3,47,91,135];

Så vil jeg gerne have at den gør det via "felter" så hvert felt har et id... hvordan gør jeg det?
Altså når man trykker på felt 1 så "rykker" den figuren hen til id=felt1

mvh thinkfast
Avatar billede roenving Novice
16. september 2003 - 23:00 #1
Så må du hente positionen på feltet:

<img src=floor.gif name=pic2 onclick=moveImage(this); width=40 height=40 border=0>

function moveImage(elm){
for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
document.images['image'].style.left = zx+'px';
document.images['image'].style.top = zy+'px';
}
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:06 #2
Hmm... Kan du forklare det ? og evt. give et lille eksempel? :D
Avatar billede skovenborg Nybegynder
16. september 2003 - 23:06 #3
eller
<html>
<head>
<script type="text/javascript">
function moveImage(idnum)
{
    document.images['image1'].style.top = document.getElementById(idnum).style.top;
    document.images['image1'].style.left = document.getElementById(idnum).style.left;
}
</script>
</head>
<body>
<div id="id1" style="position:absolute;top:10px;left:10px;width:40px;height:40px;border:1px solid #000" onclick="moveImage(this.id);"></div>
<div id="id2" style="position:absolute;top:10px;left:50px;width:40px;height:40px;border:1px solid #000" onclick="moveImage(this.id);"></div>
<div id="id3" style="position:absolute;top:50px;left:10px;width:40px;height:40px;border:1px solid #000" onclick="moveImage(this.id);"></div>
<div id="id4" style="position:absolute;top:50px;left:50px;width:40px;height:40px;border:1px solid #000" onclick="moveImage(this.id);"></div>

<img src="char1.png" id="image1" style="position:absolute;">
</body>
Avatar billede skovenborg Nybegynder
16. september 2003 - 23:06 #4
lidt sent måske og måske mere bøvet.
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:13 #5
Det var præcis det jeg skulle bruge ;)
Roenvig du kan lave svar så i kan dele hvis det er iorden med skovenborg :D
Avatar billede roenving Novice
16. september 2003 - 23:14 #6
>>skovenborg

Lykkes det dig at aflæse style.top og -.left ?-)

>>thinkfast

Ved at bruge oleboles getPos-funktion henter jeg den absolutte placering af det billede, som kalder og sætter image ind efter det !-)

Egentlig smartere end den array-løsning jeg havde fat i den anden dag, men det er jo ik' li'e altid, at man har det hele på plads i hovedet !-)

-- men den funktion virkede jo som sagt hos mig (med 8 billeder ,-)
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:14 #7
og forresten.. kan du fortælle hvordan det virker og hvordan jeg indsætter felter? er ikke helt med :D
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:15 #8
roenving kan du så ikke vise et eksempel med din kode så jeg kan se om den er bedre? for det ville være lidt lettere så!
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:19 #9
btw. skovenborg: har fundet ud af at sætte flere felter ind :D
Men mangler stadigvæk forklaring på hvordan koden virker... er ny!
Avatar billede skovenborg Nybegynder
16. september 2003 - 23:20 #10
roenving>> Hva' mener du lige med om det lykkedes??? For det gjorde det ;-)
Avatar billede skovenborg Nybegynder
16. september 2003 - 23:21 #11
Hvis du vælger den løsning er det nok lettere at sige:
<html>
<head>
<script type="text/javascript">
function moveImage(idnum)
{
    document.images['image1'].style.top = document.getElementById(idnum).style.top;
    document.images['image1'].style.left = document.getElementById(idnum).style.left;
}
</script>
<style type="text/css">
.idclass
{
    background-image:url('floor1.gif');
    width:40px;
    height:40px;
    position:absolute;
}
</style>
</head>
<body>
<div id="id1" style="top:10px;left:10px;" class="idclass" onclick="moveImage(this.id);"></div>
<div id="id2" style="top:10px;left:50px;" class="idclass" onclick="moveImage(this.id);"></div>
<div id="id3" style="top:50px;left:10px;" class="idclass" onclick="moveImage(this.id);"></div>
<div id="id4" style="top:50px;left:50px;" class="idclass" onclick="moveImage(this.id);"></div>

<img src="char1.gif" id="image1" style="position:absolute;top:10px;left:10px;width:40px;height:40px">
</body>
</html>
Avatar billede skovenborg Nybegynder
16. september 2003 - 23:23 #12
hvordan det virker???

Der sker såmen bare det at når jeg klikker på en <div> aflæser den top og left koordinaterne og derefter flytter billedet derover.
Det eneste du skal gøre er at skrive de koordinater div'en skal have.

(og så lægger jeg lige et svar hvis du gerne vil have det ;-)
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:29 #13
Mange tak for hjælpen :D
Avatar billede skovenborg Nybegynder
16. september 2003 - 23:31 #14
hov nejmen hør engang - skulle roenving ikke også have lidt. Hans virker jo også - måske bedre endda.
Avatar billede thinkfast Nybegynder
16. september 2003 - 23:58 #15
2 late :( du kan dele med ham hvis det er!
Men... Han gav jo ikke noget eksempel og kan ikke få hans til at virke så synes du fortjener pointene!
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 21/08/202610:41
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
24/0820:07 Libra Office 26.2.5.2 - Er sort - Kan an ændre til lysere baggrund ? (Windows 11) Af Ikke-ekspert i Office & Kontorpakker
24/0811:24 Hvor kan jeg finde hjælp til at flytte fra min gamle Samsung Flip4 til min nye Samsung Galaxy S24 Af vbr i Apps til Android
24/0811:16 problem med mailbesked Af Pestilensen i Excel
24/0810:45 Powerbank Af postpeter@outlook.dk i Fri debat
22/0821:38 webui_forge_cu121_torch231 med AMD Grafikkort. Af jonpet i Andet software
White papers
Flere white papers »