Script für layer

Computer: Software & Programmierung HTML & CSS
#1

hallo freunde & fans des html,

ich such eine möglichkeit, einen layer (250*250)für ca. 10 sekunden zu zeigen. der layer (noch nicht ganz klar, ob gif oder swf)soll dabei quasi aus dem nichts (rechter rand) ins bild „fliegen“ und anschließend dort wieder verschwinden.

wenns keine einfache/unkomplizierte lösung gibt bleibe ich bei den guten alten pop-ups (in dem fall dann eins, was sich nach 10sek schließt)

mfg und vielen dank im voraus

julian

#2

Hallo

Vergib dem Objekt das „fliegen“ soll eine ID, bzw. benutze ein „div“ – Tag, und setze seine Position auf „absolute“.
Weiters positioniere das Objekt per Javascript.

function lets_go(){ // in body mit onload aufrufen

// Hier Script zur Positionsberechnung einfügen

document.getElementById(„my_objekt“).style.top = obj_top;
document.getElementById(„my_objekt“).style.left = obj_left;

Timeout(„lets_go()“,50);
}

#3

hi thomas,

soweit so gut, vielen dank erstmal dafür.
den vermerk // Hier Script zur Positionsberechnung einfügen hab ich auch entdeckt, nur leider weiß ich nicht wie so ein script aussieht… kenne mich leider kaum mit sowas aus!

kannste mir ein beispiel mit ausgedachten werten schicken??

vielen dank
julian

#4

Bitteschön

Ein einfaches Script das das Objekt einmal von Links nach Rechts und wider nach Links bewegt.

Ein wenig modifizieren solltest Du es noch.

Geschwindigkeit, Dauer & Distanzen sind frei einstellbar.

var MaxPosLeft = 500; // Strecke die das Objekt zurücklegt
var PosTop = 300; // Höhe in der das Objekt sich bewegt
var StartPosLeft = -250; // Start & Endposition des Objekts = 0 - Objektbreite
var Dauer = 10; // Anzahl der Sec. die die Animation dauern soll

var TempLeft = StartPosLeft;
var TempC = 0; // für function (Durchlaufzahäler)
var Richtung = true; // Richtungsbewegung

var TimerSpeed = 25; // Anzahl der Durchläufe d. function pro Sec.
Dauer = Dauer * 1000 //TimerSpeed;

// Berechnung für die Bewegungsstrecke f. einen Durchlauf der function
var Step = 0;
if(StartPosLeft<0)Step = (-1*StartPosLeft + MaxPosLeft) / Dauer;
else Step = (StartPosLeft + MaxPosLeft) / Dauer;
Step = Step * 2;

// Beginn der eigentlichen function
function lets_go(){

// Steuert die Richtung in der sich das Objekt bewegt
if(Dauer/2>TempC)Richtung = true;
else Richtung = false;

// Berechnung der Position
if(Richtung)TempLeft += Step;
else TempLeft -= Step;

// Positionierung im Dokument
document.getElementById(„my_objekt“).style.top = PosTop;
document.getElementById(„my_objekt“).style.left = TempLeft;

// Zähler von Durchläufen, zum erkennen wenn die Richtung gewechselt werden soll
TempC++;

// Timer - Läuft einen Durchgang
if(TempLeft >= StartPosLeft)setTimeout(„lets_go()“,TimerSpeed);
}

#5

Achtung ein Fehler ist mir Passiert:

Statt dieser Zeile:
Dauer = Dauer * 1000 //TimerSpeed

Diese Zeile einfügen
Dauer = Dauer * 1000 / TimerSpeed;

LG

#6

hi thomas…

juhu es bewegt sich!! vielen dank und sternchen dafür :smile:

mfg
julian