Inserimento script nella mia home page

giorgio47 ha scritto il 19.12.2011 ore 17:47

Buon giorno,
Come devo fare per inserire uno script sulla mia home page? Il codice deve fare apparire un fiocco di neve che scende sulla pagina.
Posto qui sotto la mia procedura:
1) Clic destro mouse sulla pagina;
2) Proprietà pagine web;
3) Pagina/Codice HTML (body);
4) Inserisco il codice/Ok;
5) Copio l'immagine (una gif) del fiocco di neve nella cartella "index_web_files";
6) Eseguo l'anteprima del sito.
7) Purtroppo nell'anteprima del sito (sul mio PC) non viene visualizzato l'immagine dei fiocchi di neve, ma piccoli quadratini con all'interno una "X".
La mia domanda: in quale cartella devo copiare l'immagine del fiocco di neve?
Grazie per la risposta.
Giorgio

Commenti

magix1965 ha scritto il 19.12.2011 ore 19:42

che codice hai inserito? hai seguito un tutorial?

Vecchio utente ha scritto il 19.12.2011 ore 21:16


Il tuo programma non lo conosco
Ti posso spiegare solo il linguaggio html per vedere dove mettere l'immagine gif (Fiocco di neve).
Se controlli lo script troverai una scritta " SRC=" e il percorso dell'immagine .GIF".
Tu leggendo quella stringa sai dove il programma va a cercare l'immagine, quindi a questo punto sai dove mettere il gif.

giorgio47 ha scritto il 20.12.2011 ore 00:15
  1. Uso il programma "Magix Web Designer 7 Premium;
  2. Ho trovato questo codice che mi permette di non inserire l'immagine del fiocco;
  3. Posto il codice qui sotto:

<br /> <!--<br /> // Prelevato ed illustrato su http://www.web-link.it<br /> // CREDITS:<br /> // Snowmaker<br /> // By Peter Gehrig<br /> // Copyright (c) 2003 Peter Gehrig. All rights reserved.<br /> // Permission given to use the script provided that this notice remains as is.<br /> // Additional scripts can be found at http://Sito Sparito dalla rete<br /> // info@24fun.com<br /> // 11/27/2003

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a highly visible link to
// http://Sito Sparito dalla rete on the webpage
// where this script will be featured

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////////////////////

// Set the number of snowflakes (more than 30 - 40 not recommended)
var snowmax=95

// Set the colors for the snow. Add as many colors as you like
var snowcolor=new Array("#aaaacc","#ddddFF","#ccccDD")

// Set the fonts, that create the snowflakes. Add as many fonts as you like
var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")

// Set the letter that creates your snowflake (recommended:*)
var snowletter="*"

// Set the speed of sinking (recommended values range from 0.3 to 2)
var sinkspeed=0.6

// Set the maximal-size of your snowflaxes
var snowmaxsize=42

// Set the minimal-size of your snowflaxes
var snowminsize=18

// Set the snowing-zone
// Set 1 for all-over-snowing, set 2 for left-side-snowing
// Set 3 for center-snowing, set 4 for right-side-snowing
var snowingzone=1

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////////////////


// Do not edit below this line
var snow=new Array()
var marginbottom
var marginright
var timer
var i_snow=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/) 
var browserok=ie5||ns6||opera

function randommaker(range) { 
rand=Math.floor(range*Math.random())
    return rand
}

function initsnow() {
if (ie5 || opera) {
  marginbottom = document.body.clientHeight
  marginright = document.body.clientWidth
}
else if (ns6) {
  marginbottom = window.innerHeight
  marginright = window.innerWidth
}
var snowsizerange=snowmaxsize-snowminsize
for (i=0;i   crds[i] = 0;                     
     lftrght[i] = Math.random()*15;        
     x_mv[i] = 0.03 + Math.random()/10;
  snow[i]=document.getElementById("s"+i)
  snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
  snow[i].size=randommaker(snowsizerange)+snowminsize
  snow[i].style.fontSize=snow[i].size
  snow[i].style.color=snowcolor[randommaker(snowcolor.length)]
  snow[i].sink=sinkspeed*snow[i].size/5
  if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
  if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
  if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
  if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
  snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size)
  snow[i].style.left=snow[i].posx
  snow[i].style.top=snow[i].posy
}
movesnow()
}

function movesnow() {
for (i=0;i   crds[i] += x_mv[i];
  snow[i].posy+=snow[i].sink
  snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i]);
  snow[i].style.top=snow[i].posy
 
  if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){
   if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
   if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
   if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
   if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
   snow[i].posy=0
  }
}
var timer=setTimeout("movesnow()",50)
}

for (i=0;i document.write(""+snowletter+"")
}
if (browserok) {
window.onload=initsnow
}
// end -->

magix1965 ha scritto il 20.12.2011 ore 10:35

se ho ben capito l'effetto che vorresti ottenere è questo?

http://magix1965.altervista.org/

altra cosa che guardavo nel codice che hai postato

var browserok=ie5||ns6||opera

IE 5 in poi, netscape 6,e opera ,che browser utilizzi?

Vecchio utente ha scritto il 20.12.2011 ore 12:35

Giorgio, quello che hai postato qui sotto mi sembra uno script *.js
I dati HTML da mettere su Web Designer altri.
Tu sicuramente hai seguito un tutorial, ti consiglio di riguardarlo e rifare tutto da capo.
Comunque c'è uno script semplice da inserire nella tua pagina e senza bisogno di aggiungere lo script *.js, in quanto già presente in Google. Questi dati sono presi dal tutorial di Chiara Gasparini:


Per recuperare questi dati vai QUI e scarica il documento PDF

giorgio47 ha scritto il 20.12.2011 ore 18:38

Ho seguito fedelmente la procedura suggerita da Chiara. Lo script funziona quando eseguo l'anteprima sul mio PC. Non funziona più quando lo pubblico sul web. Uso Explorer 9. Potete suggerirmi qualche idea.

Grazie.

Giorgio

Vecchio utente ha scritto il 21.12.2011 ore 01:39

Deve funzionare, in quanto il file *.JS è gia su internet.
Prova a fare così, prima di pubblicare salva il progetto e poi esporti tramite FTP, se vedi che non va ancora prova ad aggiornare la pagina web con il tato F5, cliccando 2 o 3 volte, se anche così non va allora fai una pulizia del tuo Browser Internet Explorer 9, per fare la pulizia vai su:
Strumenti | Opzioni Internet | Generale. e su Cronologia esplorazioni clicca su " Elimina"
A questo punto se ricarichi la tua pagina Web dovresti vedere la neve.

PS:Ma tu usi solo IExplorer? perchè se fai pagine web sarebbe consigliato avere più Browser per vedere come si presenta la tua pagina su diversi Browser.
Tieni presente che alcuni script non funzionano su tutti i Browser e se funzionano magari si visualizzano in modo diverso

magix1965 ha scritto il 21.12.2011 ore 07:49

questo è il codice da inserire funziona su tutti i browser(almeno IE,mozilla,opera,da cambiare il percorso della gif alla 5 riga tra le virgolette,e la velocità di discesa alla 3 riga(var speed) e il numero dei fiocchi alla 4 riga (var flakes)

fonte:http://www.web-link.it/scripting/F12_fiocchidineve.php

http://magix1965.altervista.org/    testa il link cliccando sul mio sito

 

<br /> <!--<br /> var speed=20; // lower number for faster<br /> var flakes=20; // number of flakes<br /> var flake_image="http://magix1965.altervista.org/fiocco.gif"; // location of snowflake graphic

/***************************\
*Winter Drifting Snow Effect*
*(c) 2006   mf2fm web-design*
http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
\***************************/
/* prelevato ed illustrato su Web-Link.it
******************************************/
var swide, shigh;
var dx=new Array();
var xp=new Array();
var yp=new Array();
var am=new Array();
var sty=new Array();

window.onload=function() { if (document.getElementById) {
  var k, f, b;
  b=document.createElement("div");
  b.style.position="absolute";
  b.setAttribute("id", "bod");
  document.body.appendChild(b);
  set_scroll();
  set_width();
  for (var i=0; i     dx[i]=0;
    am[i]=Math.random()*20;
    xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
    yp[i]=Math.random()*shigh;
    sty[i]=0.75+1.25*Math.random();
    f=document.createElement("div");
f.style.position="absolute";
f.setAttribute("id", "flk"+i);
f.style.zIndex=i;
f.style.top=yp[i]+"px";
f.style.left=xp[i]+"px";
    k=document.createElement("img");
    k.src=flake_image;
f.appendChild(k);
    b.appendChild(f);
  }
  setInterval("winter_snow()", speed);
}}
 
window.onresize=set_width;
function set_width() {
  if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
  }
  else if (typeof(self.innerHeight)=="number") {
    swide=self.innerWidth;
    shigh=self.innerHeight;
  }
  else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
  }
  else {
swide=800;
shigh=600
  }
}

window.onscroll=set_scroll;
function set_scroll() {
  var sleft, sdown;
  if (typeof(self.pageYOffset)=="number") {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
  }
  else if (document.body.scrollTop || document.body.scrollLeft) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
  }
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
  }
  else {
    sdown=0;
    sleft=0;
  }
  document.getElementById("bod").style.top=sdown+"px";
  document.getElementById("bod").style.left=sleft+"px";
}

function winter_snow() {
  for (var i=0; i     yp[i]+=sty[i];
    if (yp[i]>shigh-30) {
      xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
      yp[i]=0;
      sty[i]=0.75+1.25*Math.random();
    }
    dx[i]+=0.02+Math.random()/10;
    document.getElementById("flk"+i).style.top=yp[i]+"px";
    document.getElementById("flk"+i).style.left=(xp[i]+am[i]*Math.sin(dx[i]))+"px";
  }
}
// -->

giorgio47 ha scritto il 21.12.2011 ore 13:56

Ho inserito il codice, ma facendo l'anteprima invece di vedere scendere i fiocchi di neve vedo scendere tanti piccoli quadratini bianchi con al centro una X. So che l'errore deriva dall'errato percorso della gif del fiocco di neve. Come devo fare per inserire il percorso corretto? Preciso che la gif del fiocco di neve è "flocon2.gif". L'ho copiata nelle cartelle "index_web_files" e "index_html_file".

Riporto come ho modificato lo script alla terza riga: puoi correggeremi l'errore?

Grazie.

Giorgio

var speed=20; // lower number for faster
var flakes=20; // number of flakes
var flake_image="index_web_files/flocon2.gif"; // location of snowflake graphic

magix1965 ha scritto il 21.12.2011 ore 17:40

accedi,al pannello di controllo del tuo web hosting,entra nella cartella "index_web_files" individua "flocon2.gif"(ovviamente una volta che hai effetuato l'up sul tuo sito)clikki per aprirla,il browser dovrebbe darti l'indirizzo sulla barra ,poi ti basta copiarlo e incollarlo dove richiesto

questo per esempio è il mio percorso,se ci clicchi puoi visualizzare il mio fiocco:

http://magix1965.altervista.org/fiocco.gif

giorgio47 ha scritto il 21.12.2011 ore 20:19

Puoi dirmi, per favore, se lo script che ho corretto è giusto: correzione alla terza riga.

Quando faccio l'anteprima non vedo i fiocchi, ma ancora tanti quadratini con crocette rosse.

Questo è lo script completo inserito nella head:

<br /> <!--<br /> var speed=20; // lower number for faster<br /> var flakes=20; // number of flakes<br /> var flake_image="C:\Users\Giorgio\Documents\HappyTennis_2011\index_html_files\flocon2.gif"; // location of snowflake graphic

/***************************\
*Winter Drifting Snow Effect*
*(c) 2006   mf2fm web-design*
http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
\***************************/
/* prelevato ed illustrato su Web-Link.it
******************************************/
var swide, shigh;
var dx=new Array();
var xp=new Array();
var yp=new Array();
var am=new Array();
var sty=new Array();

window.onload=function() { if (document.getElementById) {
  var k, f, b;
  b=document.createElement("div");
  b.style.position="absolute";
  b.setAttribute("id", "bod");
  document.body.appendChild(b);
  set_scroll();
  set_width();
  for (var i=0; i     dx[i]=0;
    am[i]=Math.random()*20;
    xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
    yp[i]=Math.random()*shigh;
    sty[i]=0.75+1.25*Math.random();
    f=document.createElement("div");
f.style.position="absolute";
f.setAttribute("id", "flk"+i);
f.style.zIndex=i;
f.style.top=yp[i]+"px";
f.style.left=xp[i]+"px";
    k=document.createElement("img");
    k.src=flake_image;
f.appendChild(k);
    b.appendChild(f);
  }
  setInterval("winter_snow()", speed);
}}
 
window.onresize=set_width;
function set_width() {
  if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
  }
  else if (typeof(self.innerHeight)=="number") {
    swide=self.innerWidth;
    shigh=self.innerHeight;
  }
  else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
  }
  else {
swide=800;
shigh=600
  }
}

window.onscroll=set_scroll;
function set_scroll() {
  var sleft, sdown;
  if (typeof(self.pageYOffset)=="number") {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
  }
  else if (document.body.scrollTop || document.body.scrollLeft) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
  }
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
  }
  else {
    sdown=0;
    sleft=0;
  }
  document.getElementById("bod").style.top=sdown+"px";
  document.getElementById("bod").style.left=sleft+"px";
}

function winter_snow() {
  for (var i=0; i     yp[i]+=sty[i];
    if (yp[i]>shigh-30) {
      xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
      yp[i]=0;
      sty[i]=0.75+1.25*Math.random();
    }
    dx[i]+=0.02+Math.random()/10;
    document.getElementById("flk"+i).style.top=yp[i]+"px";
    document.getElementById("flk"+i).style.left=(xp[i]+am[i]*Math.sin(dx[i]))+"px";
  }
}
// -->

magix1965 ha scritto il 21.12.2011 ore 21:58

non lo visualizzo,fai uno screenshot,come ho fatto io,però non posso sapere qual'è l'indirizzo del tuo fiocco,su di quale hosting ti servi?

magix1965 ha scritto il 22.12.2011 ore 17:24

finalmernte nevica!!

Vecchio utente ha scritto il 22.12.2011 ore 17:36

Evviva è arrivata la neve

magix1965 ha scritto il 23.12.2011 ore 12:29

e già finalmente...

lo script inserito nella mia risposta,come già detto,è funzionante su tutti i browser ringrazio ancora una volta http://www.web-link.it/ 

l'errore dell'utente era quello di non assegnare il giusto percorso,alla gif,richiamata dal codice