Søg
Avatar billede lolman Nybegynder
22. august 2006 - 16:30 Der er 16 kommentarer og
1 løsning

få billede til at hoppe tilfældigt rundt på skærmen..

Hejsan folkens.
Mit spørgsmål er som følger.
Er der nogle der kan lave en JS kode til mig som får et billede til at hoppe tilfældigt rundt på skærmen?
Avatar billede lolman Nybegynder
22. august 2006 - 17:12 #1
en lille rettelse.

Det skal være en div boks der flyver rundt på skærmen..
Avatar billede roenving Novice
22. august 2006 - 17:54 #2
Under hvilke forudsætninger ?-)

Bemærk at hvis den hopper for hurtigt eller for langt vil det helt sikkert irritere alle besøgende, mens der selvfølgelig kan være lidt sjov i, at den ikke står helt stille ...
Avatar billede lolman Nybegynder
22. august 2006 - 17:55 #3
altså det er til lidt lir. Så den må godt kunne hoppe fra det ene hjørne af skærmen til det andet. Men den må selvfølgelig ikke kunne hoppe ud af billedet . Divens w=81px og H=95px
Avatar billede roenving Novice
22. august 2006 - 18:04 #4
Måske sådan (lav selv det nødvendige om !-)

<script language="javascript" type="text/javascript">
var box = null,maxX=maxY=0;
function moveBox(){
  box.style.left = Math.floor(Math.random()*maxX);
  box.style.top = Math.floor(Math.random()*maxY);
}
window.onload = function(){
  box = document.getElementById("boxToMove");
  maxX = screen.availWidth - box.offsetWidth - 100;
  maxY = screen.availHeight - box.offsetHeight - 150;
  setInterval("moveBox()",600);
};
</script>

<div id="boxToMove" style="background:#345;color:white;text-align:center;width:150px;position:absolute;">Denne box hopper rundt<br><br>På de mærkeligste steder !-)</div>
Avatar billede roenving Novice
22. august 2006 - 18:05 #5
Gaab, havde lige glemt en detalje:

function moveBox(){
  box.style.left = Math.floor(Math.random()*maxX) + "px";
  box.style.top = Math.floor(Math.random()*maxY) + "px";
}
Avatar billede lolman Nybegynder
22. august 2006 - 18:24 #6
det ser faktiks ud til at virke.
Avatar billede roenving Novice
22. august 2006 - 18:26 #7
Måske skal du regulere på de 100 og 150, for i Opera (som jeg ikke har tilpasset !-) kunne den hoppe ud over bunden ...

Velbekomme '-)
Avatar billede roenving Novice
22. august 2006 - 18:27 #8
;O)
Avatar billede lolman Nybegynder
22. august 2006 - 18:36 #9
nu har jeg kun et andet problem. Hvordan kan jeg definere
  box.style.left = Math.floor(Math.random()*maxX) + "px";
  box.style.top = Math.floor(Math.random()*maxY) + "px";
så jeg kan få tallet ind i en anden function?
Avatar billede roenving Novice
22. august 2006 - 18:39 #10
<script language="javascript" type="text/javascript">
var box = null,maxX=maxY=actX=actY=0;
function moveBox(){
  actX = Math.floor(Math.random()*maxX);
  box.style.left = actX + "px";
  actY = Math.floor(Math.random()*maxY);
  box.style.top = actY + "px";
}
window.onload = function(){

...

-- så kan actX og -Y aflæses af alle funktioner !-)
Avatar billede roenving Novice
22. august 2006 - 18:39 #11
-- og tak for point ;~}
Avatar billede lolman Nybegynder
22. august 2006 - 18:47 #12
Jeg får beskeden "actX er ikke defineret".
Avatar billede roenving Novice
22. august 2006 - 19:00 #13
Har du husket at lave den første linje om ?-)
Avatar billede lolman Nybegynder
22. august 2006 - 19:17 #14
yes
Avatar billede lolman Nybegynder
22. august 2006 - 19:25 #15
a
Avatar billede mclemens Nybegynder
22. august 2006 - 19:34 #16
Når jeg tester virker Rønving's fint ... hvis du har
et andet script på som skal bruge actX og actY skal
Rønving's script køres før det andet script ...
(scriptet behøves ikke at køres - men variabel
linjen som står på linje et i Rønvings script
skal være deklareret inden der
forespørges på actX m.v.)



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script language="javascript" type="text/javascript">
var box = null,maxX=maxY=actX=actY=0;
function moveBox(){
  actX = Math.floor(Math.random()*maxX);
  box.style.left = actX + "px";
  actY = Math.floor(Math.random()*maxY);
  box.style.top = actY + "px";
}
window.onload = function(){
  box = document.getElementById("boxToMove");
  maxX = screen.availWidth - box.offsetWidth - 100;
  maxY = screen.availHeight - box.offsetHeight - 150;
  setInterval("moveBox()",600);
};
</script>

</head><body>

<div id="boxToMove" style="background:#345;color:white;text-align:center;width:150px;position:absolute;">Denne box hopper rundt<br><br>På de mærkeligste steder !-)</div>
</body></html>
Avatar billede mclemens Nybegynder
22. august 2006 - 19:34 #17
^ - Hvis ovenstående test ikke virker -> Hvilken browser ?
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 01:57 Tjek alle checkbox i form Af bsn i ASP
I går 21:35 Lidt simpel (håber jeg) Photoshop hjælp Af fcs i Billedbehandling
16/0516:04 Canon printer vil ikke udskrive farver Af mort1 i Printere
16/0514:50 Hvilket fabrikat af Mesh systemer virker? Af fkj i Wifi
15/0513:45 AJAX kode -javascript Af Asky i Programmeringsværktøjer
White papers
Flere white papers »