Knud Schröder: moving, zooming, coloring text

SELF-Forum

moving, zooming, coloring text

Knud Schröder
– Informationen zu den Bewertungsregeln

Hi Leute!

Ich geb' Euch mal die folgende HTML-Datei zum Besten.
(in Anlehnung an eine Idee von was weiß ich wo)

Schön wäre es, wenn man nicht einen animierten Text hätte, sondern mehrere, die
etwas Zeitversetzt starten.
(zu sehen bei fast jeder Werbung mittlerweile, scheint 'IN' zu sein, deswegen will ich das ja auch *smile*)

Da man ja nicht mehrere TimeOuts setzen kann, wird's ziemlich kompliziert mit der
zeitgesteuerten Anzeige gleich mehrerer animierter Texte.

Hat jemand eine Idee? (oder bereits realisiert?)

Knud

und hier mein DIng bisher:

<html>
<body bgcolor=white text=black onload="init()">
<style type="text/css">
body
        {
        background-color:#FFFFFF;
        font-family: Arial;
        font-size:10pt;
        }

</style>

<script>

text=new Array('Diese Seite','wird Ihnen','präsentiert<br> von','Knud Schröder');  

var numText=4;  

positionY=new Array('100','50','150','240');  

color=new Array('#000000','#2F2F2F','#4F4F4F','#7F7F7F','#408080');  

var numColors=5;  

var endSize=70;  

var Zspeed=30;  

var Cspeed=200;  

var font='Arial Black';  

var hide=false;  

var size=10;  

var gonum=0;  

var ie, n;

if (document.all) {

n=0;

ie=1;

zoomText='document.all.zoom.innerText=text[num];';

zoomSize='document.all.zoom.style.fontSize=size;';

zoomPosY='document.all.zoom.style.top=positionY[num];';

closeIt="";

fadeColor="document.all.zoom.style.color=color[num];";

}

if (document.layers) {

n=1;ie=0;

zoomText="";

zoomPosY="document.zoom.top=positionY[num];";

zoomSize="document.zoom.document.write('<p align="center" style="font-family:'+font+'; font-size:'+size+'px; color:'+color[0]+'">'+text[num]+'</p>')";

closeIt="document.zoom.document.close()";

fadeColor="document.zoom.document.write('<p align="center" style="font-family:'+font+'; font-size:'+endSize+'px; color:'+color[num]+'">'+text[numText-1]+'</p>')";

}

function zoom(num,fn){

if (size<endSize){

eval(zoomText);

eval(zoomSize);

eval(zoomPosY);

eval(closeIt);

size+=5;

setTimeout("zoom("+num+",'"+fn+"')",Zspeed);

}else{

eval(fn);

}

}

function fadeIt(num){

if (num<numColors){

eval(fadeColor);

eval(closeIt);

num+=1;

setTimeout("fadeIt("+num+")",Cspeed)

}else{

hideIt();

}

}

function hideIt(){

if(hide){

if(ie)document.all.zoom.style.visibility="hidden"

if(n)document.layers.zoom.visibility="hidden"

}

}

function init(){

if(ie){

document.all.zoom.style.color=color[0]

document.all.zoom.style.fontFamily=font

}

if(ie || n) go(0)

}

function go(num){

gonum+=1

size=10

if(num<numText){

zoom(num,'go('+gonum+')')

}else{

fadeIt(0)

}

}

</script>
<div id="zoom" align="center" style="position:absolute; top:150; left:100;" >
</div>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. moving, zooming, coloring text

    Mirko
    – Informationen zu den Bewertungsregeln

    Hi!

    (zu sehen bei fast jeder Werbung mittlerweile, scheint 'IN' zu sein, deswegen will ich das ja auch *smile*)

    Übertreib's aber bitte nicht... *g*

    Da man ja nicht mehrere TimeOuts setzen kann, wird's ziemlich kompliziert mit der zeitgesteuerten Anzeige gleich mehrerer animierter Texte.

    Hmm... der IE macht offensichtlich auch mehrere TimeOut's mit, jedenfall hat das demletzt bei einem hier zu einem perfekten Browser-Absturz geführt...

    Ansonsten (ist auch resourcenfreundlicher):
    Ruf' doch einfach eine Funktion auf, in der die verschiedenen animierten Texte verschoben werden, etwa in der Form
    fuction animtext() {
        fadetext1();
        fadetext2();
        ...
        setTimeOut("animtext()",Cspeed);
    }

    Verschiedene Startzeitpunkte und Geschwindigkeiten kannst du dann über "Warteschleifen" (if (counter > x) { ... }) machen.
    Einziger "Haken": Die Geschwindigkeit braucht einen gemeinsammen Nenner...

    Ciao,
    Mirko

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln