Förflytta ett lager längs tråd....

6 svar · 175 visningar · startad av Chavez 12 mars 2001

ChavezMedlem sedan maj 20001 953 inlägg

Trådstart12 mars 2001 14:24#1

Hejsan!

Jag har en "liten" nöt för nån av er Javascriptare att knäcka. Det är så att jag skulle vilja ha en funktion som förflyttar ett lager från ett ställe till ett annat i en sådan takt så att man ser vad som händer (det skall alltså inte bara "hoppa" till det stället, det skall synas).
Funtionen skall helst bara ta ett argument, och det är vart den ska. Sedan har jag lite speciella önskningar när det gäller hur lagret skall röra sig.
För att ni skall förstå så kan jag ge ett exemepel:
Det skall lixom fungera som en "tråd". Lagret "hänger" på denna vågrätta tråd och skall förflyttas fram och tillbaka på den.
Låt säga att lagret skall från en position långt till vänster och till en posistion som ligger åt höger. Då skall det först röra sig lite för mycket till höger, sedan röra sig tillbaka åt vänster men också denna gången lite för mycket. Nästa steg blir sedan att lägga sig på plats på den rätta positionen.

En annan sak som jag har funderat på och som skulle vara rolig är om detta också kunde ske med viss slumpmässighet. Så att antalet "missar" varierar samt längden på dem. Så att "fjonget" som jag hoppas åstakomma är mer realistiskt.
Är det någon som fattar vad jag menar och skulle kunna försöka sig på en sådan här funktion?

Om det inte finns någon som orkar så kan ni väl ge ideér om hur den rent teoretiskt skulle kunna se ut. Jag är inte så haj på Javascript men jag kanske skulle kunna fixa det med lite hjälp. Hur funkar en sådan sak som att flytta ett lager från en position till en annan med "fördröjning" så att man verkligen ser att det flyttar sig. Och hur skulle man kunna åstakomma slumpmässigheten.

Vore tacksam för hjälp med detta.

ChavezMedlem sedan maj 20001 953 inlägg

13 mars 2001 17:50#2

Jag vägrar tro att det inte finns någon som åtminstone har nån som har en idé om hur man skulle kunna få detta att fungera!

Alpha IIMedlem sedan maj 20002 993 inlägg

13 mars 2001 18:23#3

Det blir EXTREMT jobbigt att skriva ett sådant script men i Dreamweaver 4 finns det funktioner som kan åstakomma liknande saker!

ChavezMedlem sedan maj 20001 953 inlägg

13 mars 2001 21:12#4

Hur ser den funktionen ut/hur används den?
Och har den kommit i 4:an då? Sitter med DW 3 och har aldrig hittat det.

JohnsenMedlem sedan juli 2000836 inlägg

14 mars 2001 10:41#5

Lek lite med detta.
Lagerhanteringen är skriven för MSIE, men detta är bara för att du skall kunna få ett uppslag på hur man kan göra.

När du kommit fram till hur du vill ha det får vi väl slänga in lite extra så att det funkar i fler läsare.

<html>
<head>

<script>

x = 10 // Startpunkten.
slut = 500 // slutpunkten.

function flytta(){

if(x < slut){ // Skicka frammåt så länge x < slutpunkten.
document.all("l1").style.left= x;
x+=20;
setTimeout("flytta()",10);
}

else{ // När vi nått slutpunkten...
document.all('l1').style.left= x+10; // Skicka fram 10...
setTimeout("document.all('l1').style.left= x-30;",100); // Skicka tillbaka 30...
setTimeout("document.all('l1').style.left= slut;",200); // Landa på slutpunkten.
}

}
</script>

</head>
<body>
<div id="l1" style="position: absolute; top:10 left:10">abc</div>
<br>
<a href="javascript: flytta(); void(0);">Flytta</a>
</body>
</html>

/ J

[Redigerat av Johnsen den 14 mar 2001]

ChavezMedlem sedan maj 20001 953 inlägg

14 mars 2001 15:23#6

Tackar!
Det borde kunna få igång mig

ChavezMedlem sedan maj 20001 953 inlägg

15 mars 2001 21:25#7

Hejsan igen!

Försökte själv med att fixa till koden så att den tog koordinaten vart lagret skulle som argument istället som för som det var innan.
Sedan satte jag också en variabel "fart" så att man skulle kunna fixa farten på ett enkelt sätt. Men just det att lagret nu går åt två håll gjorde det lite svårt. Eftersom man flyttar lagret 20 steg så "hänger" sig funktionerna (funktionen anropar ju sig själv) så att lagret hoppar fram och tillbaka en del.
Detta löste jag genom att i if satsen ha detta: "x + fart < slut". Det funkar ju. Men det är ingen bra lösning, och varför? Jo det där +fart (20 i detta fallet) gör att det blir olika placering hela tiden eftersom 20 är så "brett".

Är det någon som fattar vad jag menar? Om inte, så testa koden nedan, utan " +fart" alltså bara "x < slut" så får ni se hur funktionen "hänger" sig (samma med den andra if satsen, ta bort " - fart"). Nån som har en idé om hur man skall lösa det? Känner att denna koden inte är speciellt snyggt skriven, finns säkert något enkelt sätt att fixa det, men med min tomma hjärna så fungerar det lixom inte för mig

Här kommer iaf den koden som jag kommit fram till hittils (men den är som sagt inte helt bra):

<html>
<head>
<script>

x = 10							

function flytta(slut){

fart = 20
start =10		

if(x + fart < slut){ 								
document.all("lager").style.left= x;
x+=fart; 
y=slut;
setTimeout("flytta(y)",1);

}else if(x - fart > slut){ 
document.all("lager").style.left= x;
x-=fart; 
y=slut;
setTimeout("flytta(y)",1);

}else if(x == slut){
document.all('lager').style.left= x;
}
}
</script>
</head>

<body>

<div id="lager" style="position:absolute; top:10 left:10px; z-index:1; background-color: #666666; layer-background-color: #666666; ">abc</div><br>
<a href="#" onMouseOver="javascript: flytta(600);">600</a><p>

</body>
</html>