Následující skript jsem vytvořil jako náhradu běžícího textu, který pracuje pouze v IE, a blikajícího textu, který naopak pracuje pouze v NN.

Pomocí absolutního pozicování a změny pozice JavaScriptem můžete vytvořit proužek, který bude běžet po obrazovce nebo bude blikat. Pomocí JavaScriptu pak uděláte cyklus, který bude vždy daný text (ve skutečnosti celý element DIV) posouvat – bude se měnit jeho pozice anebo ho pro blikání skryje / zviditelní.

Příklad stránky s běžícím a blikajícím textem najdete zde. Kód vypadá takto:

<html>
<head>
</head>
<body onload="DoMove();blink();" text="#000000">
<span id="ticker" style="position:relative; left:2000px; top:220px; height:18px; width:1000; background-color:#800000;"> // pozicování proužku běžícího textu
<a href="http://interval.cz">http://interval.cz</A> tvorba webu, tipy a triky… <A HREF="interval.cz">Klikněte zde!</A>
</span>
<p>
<span id="blinktext" style="position: relative;"> // vymezení blikajícího textu
Blikající text
</span>
<script language="JavaScript" type="text/javascript" src="animtext.js"></script>
</body>
</html>

Skript animtext.js, který obsahuje potřebné funkce:

var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) { // zjisti dostupný objekt pro práci se stylem dokumentu
  if (document.getElementById)
    return document.getElementById(name).style;
  else
    if (document.all)
      return document.all[name].style;
    else
      if (document.layers)
        return document.layers[name];
}

// nastavení pro marquee
nStart = 800; // počáteční pozice textu
nEnd = -950; // koncová pozice textu
nTimeOut = 50; // rychlost
nInc = 5; // počet znaků v jednom kroku
nLeft = nStart;
var tc = ap_getObj(‚ticker‘);

function DoMove(){ // posuň text
  if (DHTML) {
    nLeft = nLeft – nInc;
    if (nLeft < nEnd) {
      nLeft = nStart;
    }
    tc.left = nLeft;
    setTimeout(‚DoMove()‘,nTimeOut);
}
}

// nastavení pro blikající text
var a=0;
var ok=true;
var btx = ap_getObj(‚blinktext‘);
 

function blink() {
  if (!DHTML)
    return; // pokud nepodporuje prohlížeč funkce pozicování, ukončit
  k=true;
  if (a==0 && ok==true){
    btx.visibility="hidden";ok=false;a=1
  }
  if (a==1 && ok==true){
    btx.visibility="visible";ok=false;a=0
  }
  setTimeout(‚blink()‘,300);
}

Nevýhodou může být, že se text roluje v celé šířce okna, zdatnější programátoři si ale jistě podle tohoto tipu skript přizpůsobí pro svou potřebu. Na stránce může být jen jeden běžící nebo blikající text – nechtěl jsem zbytečně komplikovat kód. Jistě to však v řadě případů vyhoví, ona kompletně blikající stránka asi nebude až tak dobrá. Uvedený skript pracuje ve většině nejpoužívanějších prohlížečů – IE, NN a Opera.

Starší komentáře ke článku

Pokud máte zájem o starší komentáře k tomuto článku, naleznete je zde.

Žádný příspěvek v diskuzi

Odpovědět