Raccolta di Javascript, utilizzabili nei forum - revisione 2011

« Older   Newer »
  Share  
view post Posted on 12/1/2011, 00:28
Avatar

Staff

Group:
ForumFree Staff
Posts:
109,436
Location:
Slayer's Flag

Status:


Introduzione


Questo topic non ha la pretesa di essere una guida ai javascript, ma è una semplice raccolta di script direttamente utilizzabili nei forum di forumfree / forumcommunity, si tratta di script copiati da svariate fonti e siti di risorse per webmaster, ogni script è completo dei credits dell'autore o del sito da cui sono stati prelevati (quando questi credits erano disponibili, per quelli senza credits, nel caso ne conosciate l'origine o il nome dell'autore, siete pregati di comunicare questi dati all'amministrazione del NewsBoard Forum che provvederà ad aggiungere i riconoscimenti mancanti).

La raccolta è organizzata in tre sezioni oltre a questa introduzione, che contiene anche un elenco di link a siti che trattano l'argomento javascript, per chi desideri apprenderne gli elementi di base o approfondire una conoscenza già posseduta, seguita dalla sezione 1 contiene gli indici delle sezioni 2 e 3

Nella sezione 2 trovate script realizzati appositamente per l'utilizzo sui forum / blog di ForumFree, ForumCommunity e BlogFree, con le indicazioni su dove inserirli e, se necessario, le istruzioni su come modificarli, nella sezione 3 sono raccolti script di utilizzo generale

Gli script più ingombranti sono coperti dal tag spoiler, per evitare uno spaginamento del post che renderebbe difficile la consultazione della guida

Links utili
Corso completo di JAVASCRIPT

Guida JavaScript di base di html.it

Guida JavaScript per esempi di html.it

W3Schools JavaScript Tutorial (in lingua inglese)


Sezione 1, Indici


Indice Javascript ForumFree
Sezione 3, Javascript ForumFree



Indice Javascript generici
Sezione 4, Javascript generici

 
Web  Top
view post Posted on 12/1/2011, 00:28
Avatar

Staff

Group:
ForumFree Staff
Posts:
109,436
Location:
Slayer's Flag

Status:


Sezione 2, Javascript ForumFree



Sfondo del forum a scelta casuale ad ogni refresh della pagina ( due sfondi )



CODICE
<script type="text/javascript"><!--
var wall=2;

switch(Math.floor(Math.random()*wall)){

      case 0:
              document.write('<style type="text/css">body{background-image:url("http://indirizzo_immagine_0.jpg")}<\/style>');
              break;

      case 1:
              document.write('<style type="text/css">body{background-image:url("http://indirizzo_immagine_1.jpg")}<\/style>');
              break;

}
//--></script>


Nota
Va inserito in Amministrazione > Grafica > Codice HTML > Codice HTML che sarà mostrato in CIMA a tutte le pagine, la scelta casuale è limitata a due sfondi


Sfondo del forum ad alternanza giornaliera ( due sfondi )



CODICE
<script type="text/javascript"><!--
var wall=2;
var now=new Date(),today=now.getDate(); while(today>wall)today-=wall;

switch(today){

     case 1:
             document.write('<style type="text/css">body{background-image:url("http://indirizzo_immagine_1.jpg")}<\/style>');
             break;

     case 2:
             document.write('<style type="text/css">body{background-image:url("http://indirizzo_immagine_2.jpg")}<\/style>');
             break;

}
//--></script>


Nota
Va inserito in Amministrazione > Grafica >Codice HTML > Codice HTML che sarà mostrato in CIMA a tutte le pagine, utilizzando questo script il forum avrà due sfondi che si alterneranno giornalmente


Nascondere le firme in sezioni a scelta



CODICE
<script type="text/javascript">sign=1;

if(document.title.indexOf("nome_sezione_1")!=-1)sign=0;

if(document.title.indexOf("nome_sezione_2")!=-1)sign=0;

if(sign==0)document.write("<style>.signature, .bottomborder {display:none}<\/style>")

</script>


Nota
Va inserito in Amministrazione > Grafica > Codice HTML > Codice HTML che sarà mostrato in CIMA a tutte le pagine, per nascondere le firme in più di due sezioni aggiungere altri
CODICE
if(document.title.indexOf("nome_sezione_3")!=-1)sign=0;

allo script ( oppure rimuovere quello col nome_sezione_2 se si desidera nascondere le firme in un'unica sezione, può funzionare anche inserendo i titolo di discussioni, in questo caso nasconderà le firme solo nelle discussioni scelte )


Discussione con messaggi senza autore



CODICE
<script type="text/javascript"><!--
avat=1;

if(document.title.indexOf("Titolo_Discussione")!=-1) avat=0;

if(avat==0) document.write("<style>.post .left, .left_bottom, .left_top {display: none}<\/style>")
//--></script>


Nota
Utilizzando questo script è possibile realizzare una discussione con messaggi senza autore, un risultato simile a questo

https://newsboard.forumfree.it/?t=53272432&p=435592827

ma esteso a tutti i messaggi della discussione, va inserito in Amministrazione > Grafica > Codice HTML > Codice HTML che sarà mostrato in CIMA a tutte le pagine, per modificare più discussioni aggiungere altri
CODICE
if(document.title.indexOf("Titolo_Discussione")!=-1) avat=0;

allo script
 
Web  Top
view post Posted on 12/1/2011, 00:28
Avatar

Staff

Group:
ForumFree Staff
Posts:
109,436
Location:
Slayer's Flag

Status:


Sezione 3, Javascript generici



Orologio



CODICE
<h4>Sono le <script type="text/javascript">
<!--
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()

if (minutes < 10)
minutes = "0" + minutes

document.write(hours + ":" + minutes + " ")
if(hours > 11){
document.write("PM")
} else {
document.write("AM")
}
//-->
</script>
</h4>


Data



CODICE
<script type="text/javascript">today=new Date(); document.write("La data di oggi: ", today.getDate(),"/",today.getMonth()+1,"/",today.getFullYear())</script>


Messaggio di avviso con pulsante

CODICE
<script type="text/javascript">
<!--
alert("inserisci qui il testo")
//-->
</script>


Messaggio di conferma con due pulsanti



CODICE
<script type="text/javascript">
<!--
if (!confirm("inserisci quì il testo"))
{history.back();}
//-->
</script>


Testo ( Nome Forum ) lampeggiante nella barra del titolo



CODICE
<script type="text/javascript">
var tt = 0;
var FMess = new Array("TESTO 1","TESTO 2","TESTO 3");

function FTitle()
{
document.title = FMess[tt]
tt = (tt < (FMess.length -1)) ? tt + 1 : 0;
setTimeout('FTitle()',1000);
}
FTitle();
</script>


Nota
Va inserito in Amministrazione > Grafica > Codice HTML > Codice HTML che sarà mostrato in FONDO a tutte le pagine, si possono aggiungere altre frasi o parole in questo punto dello script
new Array("TESTO 1","TESTO 2","TESTO 3","TESTO 4");
per variare il tempo di lampeggiamento modificare questo parametro
setTimeout('FTitle()',1000);
dove il tempo è espresso in millesimi di secondo ( 1000 = 1 secondo )


Immagine diversa ad ogni refresh della pagina



Inserire qui i link delle immagini
CODICE
<script type="text/JavaScript">
<!--
function image() {
};

image = new image();
number = 0;
// imageArray
image[number++] = "<img src='URL_PRIMA_IMMAGINE'>"
image[number++] = "<img src='URL_SECONDA_IMMAGINE'>"
image[number++] = "<img src='URL_TERZA_IMMAGINE'>"
// Aggiungi qui le altre immagini ....
increment = Math.floor(Math.random() * number);
// -->
</script>


inserire questo script
CODICE
<script type="text/JavaScript">
document.write(image[increment]);
</script>

dove devono apparire le immagini

Nota
per aggiungere altre immagini, basta ripetere questa stringa
CODICE
image[number++] = "<img src='URL_IMMAGINE'>"



Immagine casuale ad ogni refresh della pagina



CODICE
<script type="text/javascript">
<!--
img = new Array()
ran = Math.floor(3 * Math.random());
img[0] = 'URL_PRIMA_IMMAGINE';
img[1] = 'URL_SECONDA_IMMAGINE';
img[2] = 'URL_TERZA_IMMAGINE';
document.write("<img src=\""+img[ran]+"\">");
// -->
</script>


Nota
per aggiungere altre immagini aggiungere altre stringhe
CODICE
img[3] = 'URL_QUARTA_IMMAGINE';

e modificare in questa questa parte il numero delle immagini
CODICE
ran = Math.floor(4 * Math.random());



Nome del forum con decorazione a onde nella barra del titolo



SPOILER (click to view)
CODICE
<script type="text/javascript">
// VICKYS.cjb.net © -
var message = new Array();
message[0] = "INSERISCI QUI IL NOME DEL FORUM"
var reps = 2;
var speed = 80;
var p = message.length;
var T = "";
var C = 0;
var mC = 0;
var s = 0;
var sT = null;
if (reps < 1) reps = 1;
function doIt() {
T = message[mC];
A();
}
function A() {
s++;
if (s > 8) { s = 1;}
if (s == 1) { document.title = '.¸.·´¯·.¸.·´¯·.¸.·´¯· '+T+' ¸.·´¯·.¸.·´¯·.¸.·´¯·.'; }
if (s == 2) { document.title = '·.¸.·´¯·.¸.·´¯·.¸.·´¯ '+T+' .·´¯·.¸.·´¯·.¸.·´¯·.¸'; }
if (s == 3) { document.title = '·.¸.·´¯·.¸.·´¯·.¸.·´¯ '+T+' ·´¯·.¸.·´¯·.¸.·´¯·.¸.'; }
if (s == 4) { document.title = '¯·.¸.·´¯·.¸.·´¯·.¸.·´ '+T+' ´¯·.¸.·´¯·.¸.·´¯·.¸.·'; }
if (s == 5) { document.title = '´¯·.¸.·´¯·.¸.·´¯·.¸.· '+T+' ¯·.¸.·´¯·.¸.·´¯·.¸.·´'; }
if (s == 6) { document.title = '·´¯·.¸.·´¯·.¸.·´¯·.¸. '+T+' ·.¸.·´¯·.¸.·´¯·.¸.·´¯'; }
if (s == 7) { document.title = '.·´¯·.¸.·´¯·.¸.·´¯·.¸ '+T+' ·.¸.·´¯·.¸.·´¯·.¸.·´¯'; }
if (s == 8) { document.title = '¸.·´¯·.¸.·´¯·.¸.·´¯·. '+T+' .¸.·´¯·.¸.·´¯·.¸.·´¯·'; }if (C < (8 * reps)) {
sT = setTimeout("A()", speed);
C++;
}
else {
C = 0;
s = 0;
mC++;
if(mC > p - 1) mC = 0;
sT = null;
doIt();
}
}
doIt();
</script>


Nota
Va inserito in Amministrazione > Grafica > Codice HTML > Codice HTML che sarà mostrato in FONDO a tutte le pagine


Messaggio casuale ad ogni refresh della pagina



CODICE
<script type="text/javascript">
var numero_casuale = Math.round(Math.random() * 3); //modificare il numero 3 a seconda di quanti messaggi casuali ci siano
var messaggi = new Array('Primo testo casuale', 'Secondo testo casuale', 'terzo testo casuale')
document.write(messaggi[numero_casuale]);
</script>


Link arcobaleno



SPOILER (click to view)
CODICE
<script type="text/javascript">
////////////////////////////////////////////////////////////////////
// Setting

var rate = 20; // Increase amount(The degree of the transmutation)


////////////////////////////////////////////////////////////////////
// Main routine

if (document.getElementById)
window.onerror=new Function("return true")

var objActive; // The object which event occured in
var act = 0; // Flag during the action
var elmH = 0; // Hue
var elmS = 128; // Saturation
var elmV = 255; // Value
var clrOrg; // A color before the change
var TimerID; // Timer ID


if (document.all) {
document.onmouseover = doRainbowAnchor;
document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
document.onmouseover = Mozilla_doRainbowAnchor;
document.onmouseout = Mozilla_stopRainbowAnchor;
}


//=============================================================================
// doRainbow
// This function begins to change a color.
//=============================================================================
function doRainbow(obj)
{
if (act == 0) {
act = 1;
if (obj)
objActive = obj;
else
objActive = event.srcElement;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}


//=============================================================================
// stopRainbow
// This function stops to change a color.
//=============================================================================
function stopRainbow()
{
if (act) {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}


//=============================================================================
// doRainbowAnchor
// This function begins to change a color. (of a anchor, automatically)
//=============================================================================
function doRainbowAnchor()
{
if (act == 0) {
var obj = event.srcElement;
while (obj.tagName != 'A' && obj.tagName != 'BODY') {
obj = obj.parentElement;
if (obj.tagName == 'A' || obj.tagName == 'BODY')
break;
}

if (obj.tagName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}


//=============================================================================
// stopRainbowAnchor
// This function stops to change a color. (of a anchor, automatically)
//=============================================================================
function stopRainbowAnchor()
{
if (act) {
if (objActive.tagName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}


//=============================================================================
// Mozilla_doRainbowAnchor(for Netscape6 and Mozilla browser)
// This function begins to change a color. (of a anchor, automatically)
//=============================================================================
function Mozilla_doRainbowAnchor(e)
{
if (act == 0) {
obj = e.target;
while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
obj = obj.parentNode;
if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
break;
}

if (obj.nodeName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = obj.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}


//=============================================================================
// Mozilla_stopRainbowAnchor(for Netscape6 and Mozilla browser)
// This function stops to change a color. (of a anchor, automatically)
//=============================================================================
function Mozilla_stopRainbowAnchor(e)
{
if (act) {
if (objActive.nodeName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}


//=============================================================================
// Change Color
// This function changes a color actually.
//=============================================================================
function ChangeColor()
{
objActive.style.color = makeColor();
}


//=============================================================================
// makeColor
// This function makes rainbow colors.
//=============================================================================
function makeColor()
{
// Don't you think Color Gamut to look like Rainbow?

// HSVtoRGB
if (elmS == 0) {
elmR = elmV; elmG = elmV; elmB = elmV;
}
else {
t1 = elmV;
t2 = (255 - elmS) * elmV / 255;
t3 = elmH % 60;
t3 = (t1 - t2) * t3 / 60;

if (elmH < 60) {
elmR = t1; elmB = t2; elmG = t2 + t3;
}
else if (elmH < 120) {
elmG = t1; elmB = t2; elmR = t1 - t3;
}
else if (elmH < 180) {
elmG = t1; elmR = t2; elmB = t2 + t3;
}
else if (elmH < 240) {
elmB = t1; elmR = t2; elmG = t1 - t3;
}
else if (elmH < 300) {
elmB = t1; elmG = t2; elmR = t2 + t3;
}
else if (elmH < 360) {
elmR = t1; elmG = t2; elmB = t1 - t3;
}
else {
elmR = 0; elmG = 0; elmB = 0;
}
}

elmR = Math.floor(elmR).toString(16);
elmG = Math.floor(elmG).toString(16);
elmB = Math.floor(elmB).toString(16);
if (elmR.length == 1) elmR = "0" + elmR;
if (elmG.length == 1) elmG = "0" + elmG;
if (elmB.length == 1) elmB = "0" + elmB;

elmH = elmH + rate;
if (elmH >= 360)
elmH = 0;

return '#' + elmR + elmG + elmB;
}

</script>


Aggiungi a preferiti (Firefox e Internet Explorer)



Javascript aggiunto da RedVar

CODICE
<script type="text/javascript">

function bookmarksite(title, url){
if (document.all)
window.external.AddFavorite(url, title);
else if (window.sidebar)
window.sidebar.addPanel(title, url, "")
}

</script>

<a href="javascript:bookmarksite('nome_forum', 'url_forum')">Aggiungi il forum ai tuoi preferiti</a>


Banner o minibanner casuale ad ogni refresh della pagina



Javascript aggiunto da RedVar

CODICE
<script type="text/javascript">
var openInNewWin = true;

var banners = new Array();
banners[0] = new Banner("Url", "descrizione_img", "url_img");
banners[1] = new Banner("Url", "descrizione_img", "url_img");

function Banner(url, description, image) {
this.url = url;
this.description = description;
this.image = image;
return this;
}
var bNum = Math.round(Math.random() * (banners.length - 1));


document.write("<a href=\"" + banners[bNum].url + "\"");
if (openInNewWin) {
document.write(" target=\"_blank\"");
}
document.write(">");
document.write("<img src=\"" + banners[bNum].image + "\" border=\"0\" alt=\"" + banners[bNum].description + "\">");
document.write("</a>");

</script>


Nota
per ogni banner /minibanner basta inserire una riga come questa
CODICE
banners[N] = new Banner("Url", "descrizione_img", "url_img");

e modificare N con un numero progressivo e i campi Url, descrizione_img e url_img rispettivamente con il link al forum (nel caso delle affiliazioni), la descrizione dell'immagine (corrisponde all'alt) e l'indirizzo dell'immagine.


Messaggio in base all'ora nel titolo della pagina



Javascript aggiunto da ~ LightStyle

CODICE
<script type="text/javascript"><!--
function setTitle(title) {document.title+=' | '+title;}
hour = new Date().getHours();
title = new Array();

title[0]='Buon Mattino!';
title[1]='Buon Pomeriggio';
title[2]='Buona sera!';
title[3]='Buona notte!';

if (hour>=3 && hour<=12) setTitle(title[0]);
else if(hour>=13 && hour<=18) setTitle(title[1]);
else if(hour>=19 && hour<=23) setTitle(title[2]);
else setTitle(title[3]);
// --></script>


Nota

Questo script aggiunge un testo personalizzato al titolo in base all'ora.
Per aggiungere dei messaggi, basta aggiungere title[n]='testo'; dopo l'ultimo elemento title[n]='testo'; , dove n è il numero incrementato di uno rispetto all'ultimo elemento e testo è il messaggio da visualizzare nel titolo.

Potete variare anche gli orari, andando a modificare la parte
if (hour>=3 && hour<=12) setTitle(title[0]);
else if(hour>=13 && hour<=18) setTitle(title[1]);
else if(hour>=19 && hour<=23) setTitle(title[2]);
else setTitle(title[3]);


 
Web  Top
2 replies since 12/1/2011, 00:28   3852 views
  Share