Articoli marcati con tag ‘tutorial javascript’

« Vecchi articoli

Javascript: Crea il tuo Jumpmenu

2 lug 2009
Tag:, , | Pubblicato in HowTo, Javascript | Nessun commento »

Il Jumpmenu è un menu a scelta rapida, molto utile perché consente una navigazione più veloce all’interno del sito. Di solito è utilizzato attraverso l’utilizzo del tag Ecco un esempio commentato:

 
function JumpMenu(links) {
//Crea un link all'indice della select selezionato
location.href = links[links.selectedIndex].value;
}
 
//Crea la tabella di dati contenente le voci delle possibili opzioni
var voci = new Array();
voci[0] = "Pagina 1";
voci[1] = "Pagina 2";
voci[2] = "Pagina 3";
voci[3] = "Pagina 4";
voci[4] = "Pagina 5";
//Crea la tabella di dati contenente i link alle rispettive voci delle opzioni
 
var link = new Array();
link[0] = "pagina1.htm";
link[1] = "pagina2.htm";
link[2] = "pagina3.htm";
link[3] = "pagina4.htm";
link[4] = "pagina5.htm";
 
//Crea la struttura Html della select, all'evento onChange lancia la funzione
document.write("");
document.write("Jump to...");
 
//Esegue un ciclo ed estende tutte le voci del menu con i relativi valori
for(i=0; i<5; i++) {
document.write("" + voci[i] + "");
}
 
document.write("");

Javascript: Password per pagine

2 lug 2009
Tag:, , | Pubblicato in HowTo, Javascript | Nessun commento »

Vi piacerebbe creare una pagina protetta? Si può fare utilizzando una semplice funzione di Javascript.

 
<!--mce:0-->
<form>
Inserisci la password:
 
 
 
</form>

Cliccando il pulsante si attiverà in automatico lo script che permetterà di prendere il contenuto del campo password. In caso di password corretta, l’utente sarà indirizzato alla pagina correte, mentre se la pass è sbagliata sarà visualizzato l’errore di pagina inesistente.

Javascript: Permettere di Aggiungere ai preferiti

1 lug 2009
Tag:, , | Pubblicato in Javascript, Programmazione | 3 Commenti »

Vi piacerebbe offrire ai vostri utenti un nuovo modo di inserire il vostro sito nei preferiti? Invece di impostare di base il titolo del sito, l’utente potrà inserire un titolo a scelta. Ecco come:

 
bAggiungi a Preferiti/b
brbr
Inserisci il Titolo
form name="preferiti"
input type="text" name="titolo" onkeyup="document.title=this.value"
input type="button" value="Aggiungi" onclick="window.external.AddFavorite(location.href, document.title)"
/form
/p

Javascript: Modificare elementi pagina Parte 2

1 lug 2009
Tag:, | Pubblicato in HowTo, Javascript | Nessun commento »

Mettiamo questa volta, di voler modificare l’attributo delle dimensioni di un div, al solo passaggio del mouse, Ecco il codice:

 
script language="Javascript"
!--
function cambiadim(h,w)
{
document.getElementById('par1').style.height = h + 'px';
document.getElementById('par1').style.width = w + 'px';
}
--
/script
 
div id="par1" 
style="height: 10px; width: 10px; background-color: #FF0000" 
OnMouseOver="cambiadim(100,100)"
/div

Javascript: Cambiare aspetto agli elementi

1 lug 2009
Tag:, , | Pubblicato in HowTo, Javascript, Programmazione | Nessun commento »

Cambiare gli aspetti della vostra pagina web utilizzando del semplice codice javascript è possibile. Mettiamo il caso di voler cambiare il testo contenuto in un paragrafo:

 
script language="Javascript"
!--
function cambiacolore(nuovo_colore)
{
document.getElementById('par1').style.color = nuovo_colore;
}
--
/script
 
p id="par1" style="color: #FF0000;"Ciao!/p
 
input type="button" value="Cambia Colore!" OnClick="cambiacolore('#0000FF')"

Javascript: Download sul tuo sito

1 lug 2009
Tag:, , | Pubblicato in HowTo, Javascript | 1 Commento »

Vi piacerebbe mettere a disposizione dei vostri utenti una sezione download da cui scaricare software utile? La soluzione più corretta è quella di rimandare l’utente ad un file interno. Ecco il codice per effettuare questa funzione:

 
// Recupero la querystring ed il nome del file da scaricare
var querystring = location.search;
var file = querystring.substring(6);
 
// Imposto la funzione di download
// con un link al file specificato
function Download()
{
    location.href = file;
}
 
// Imposto il messaggio
var msg;
 
// Verifico che sia stato specificato un file
// ed in caso lancio la funzione di download
if (file == "" || file == "undefined" || file.charAt(0) == " ")
{
    msg = "Nessun file specificato";
}
else
{
    msg = "Stà per partire il download del file " + file.bold();
    window.setTimeout("Download()", 5000);
}
 
// Stampo a video il messaggio
document.write(msg);

Javascript: Creare popup semi trasparenti

30 giu 2009
Tag:, , | Pubblicato in Javascript, Programmazione | 1 Commento »

Utilizzando il metodo create Popup, potete creare utilizzando Javascript delle finestre popup che simula l’apertura di una nova pagina. Il contenuto di queste pagine viene scritto direttamente all’interno del codice Javascript. Seguite il codice commentato:

 
// CREO L'OGGETTO POPUP
var popup = window.createPopup();
var contenuto = popup.document.body;
 
// IMPOSTO GLI STILI CSS
contenuto.style.backgroundColor = "#EEEEEE";
contenuto.style.color = "#000000";
contenuto.style.fontSize = "10";
contenuto.style.fontFamily = "Verdana";
contenuto.style.padding = "10";
contenuto.style.border = "Solid #CCCCCC 1px";
 
// SCRIVO ALL'INTERNO DEL POPUP
contenuto.innerHTML = "Contenuto...";
 
// MOSTRO IL POPUP
popup.show(150, 150, 450, 500, document.body);

Javascript: Data che si aggiorna senza refresh

30 giu 2009
Tag:, | Pubblicato in Javascript | Nessun commento »

Va molto di moda mostrare all’interno di siti la data e l’ora corrente, create un testo a cui assegnare uno script di riferimento:

E poi inserite il seguente codice:

 
function OrologioScorrevole()
{
    var data = new Date();
    var hh = data.getHours();
    var mm = data.getMinutes();
    var ss = data.getSeconds();
    var ora = hh + ":" + mm + ":" + ss;
    document.getElementById("orologio").innerText = ora;
    window.setTimeout("OrologioScorrevole()", 1000);
}

Javascript: Disattivazione tasti mouse

19 giu 2009
Tag:, | Pubblicato in HowTo, Javascript, Php | Nessun commento »

Codice per disattivare tasti del mouse, questa funzione è molto utile per evitare che altri utenti utilizzino la funzione copia e incolla per salvare le proprie immagine.

 
function bloccoTasti()
{
/*Faccio riferimento al tasto sinistro del mouse attribuendo come valore della proprietà button il numero 1.*/
    if (window.event.button == 1)
    {
        alert("Il tasto sinistro del mouse e' disabilitato");
    }
    else//in caso contrario...
    {
        alert("Il tasto destro del mouse e' disabilitato");
    }
}

Javascript: Come impostare il refresh automatico della pagina

18 giu 2009
Tag:, , | Pubblicato in HowTo, Programmazione | Nessun commento »

Questo script permette di impostare il caricamento automatico di una pagina dopo un tot di tempo deciso dall’utente. Molto utile per siti che hanno al loro interno contenuti che devono costantemente esser aggiornati.

 
 
 
<TITLE>Refresh automatico temporizzato</TITLE>
 
 
function doRefresh() {
  // refresh della pagina corrente
  document.location.reload();
}
// imposto il timeout per il prossimo refresh
// espresso in millisecondi (1000 = 1 secondo)
window.setTimeout("doRefresh();", 1000);
 
 
 
 
 
 
// verifico il refresh della pagina
var msg = "Questa pagina è stata letta" +
  "<BR><B>" + Date() + "</B>";
document.write(msg);
« Vecchi articoli