Script Testo titolo che ondeggia su scripting di WebLink

K12 - Testo titolo che ondeggia.

Funziona con il Browser:

firefox

Safari

opera

internet explorer

Chrome

Crediti:
Nome: Brian Gosselin
Website: http://scriptasylum.com

Descrizione:Una scritta che ondeggia alla quale associare il titolo di una pagina ed essere certi che venga notato. Possibilità di far seguire questa scritta al puntatore del mouse.

Passo 1 :

Selezionare tutto il codice cliccando sulla forbice, quindi posizionatevi sul testo evidenziato, adoperate il tasto destro del mouse per l'operazione di copia ed incolla, posizionatelo nella vostra pagina fra i tags <body> e </body>.

// ENTER TEXT BELOW. CAN *NOT* INCLUDE NORMAL HTML CODE.
var text='TESTO TITOLO CHE ONDEGGIA';
var delay=40;              // SPEED OF TRAIL
var txtw=32;               // AMOUNT OF PIXEL SPACE EACH CHARACTER OCCUPIES
var xoff=30;               // OFFSET FROM THE LEFT OF THE PAGE *OR* FROM THE MOUSE CURSOR DEPENDING ON THE "mousefollow" SETTING.
var yoff=10;               // OFFSET FROM THE TOP OF THE PAGE *OR* FROM THE MOUSE CURSOR DEPENDING ON THE "mousefollow" SETTING.
var sampleinc=0.3;         // NUMBER OF PIXELS TAKEN ALONG THE "X" AXIS AT A TIME
var amplitude=35;          // THE HEIGHT OF THE WAVE IN PIXELS
var mousefollow=false;     // true=FOLLOWS THE MOUSE/ false=STAYS AT THE xoff/yoff COORDINATES.
var beghtml='<h1>';        // OPTIONAL HTML THAT EFFECTS THE WHOLE STRING.
var endhtml='<\/h1>';       // OPTIONAL HTML CODE ONLY NEEDED IF ABOVE NEEDS AN "END" HTML TAG.

//********** NO NEED TO EDIT BELOW HERE **********\\

ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var t='';
var ex=sampleinc;
var mousex=0;
var mousey=0;
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer name="txt'+i+'" top="-1000" left="0" width="'+txtw+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-1000px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '<\/layer>' : '<\/div>';
}
document.write(t);

function adjmousepos(evt){
mousex=xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
mousey=yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}

function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}

function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}

function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}

function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}

window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
setInterval('movetxts()',delay);
if(mousefollow){
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=adjmousepos;
}}
// end -->
</script>

Note: Semplice da configurare si trova tutto nelle prime righe dello script dove:

var text='testio'; Il testo della scritta che dovrà ondeggiare.

var delay=40; Velocità di animazione, maggiore è il numero e più lenta sarà l'animazione.

var txtw=32; Distanza in pixel fra le lettere che formano la frase.

var xoff=30; Distanza in pixel dal margine laterale o dal puntatore del mouse nel caso venisse impostato a true il parametro per mousefollow.

var yoff=10; Distanza in pixel dal margine superiore o dal puntatore del mouse nel caso venisse impostato a true il parametro per mousefollow.

var sampleinc=0.3; Movimento o frequenza in pixel che formano l'onda dell'animazione.

var amplitude=35; Altezza in pixel dell'onda che forma l'animazione.

var mousefollow=false; Se impotato su true la scritta fa riferimeno alla posizione ricavata dalle cordinate del mouse sullo schermo.

var beghtml='<h1>'; Tag di html che ne determina le dimensioni, altri valori <h2> <h3> <h4> <h5> <h6>

var endhtml='<\/h1>'; Chiusura del tag di HTML a seconda di cosa viene impostato nel parametro sopra </h2> </h3> </h4> </h5> </h6>.

Elenco completo degli script.

Se avete domande da fare potete scrivere sul forum di supporto , gratuito e aperto a tutti.

JavaScript K12