Jak zrobić śnieg na stronie?

Problemy związane ze stronami HTML

Jak zrobić śnieg na stronie?

Postprzez Camillo » N gru 30, 07 01:01

Witam! Mam stronę w HTML i nie wiem jak zrobić śnieg na stronie. Czy ktoś mógłby mi pomóc?
Camillo
 
Posty: 37
Dołączył(a): N gru 30, 07 00:59

Postprzez Trystek » N gru 30, 07 01:26

wystarczy dodać skrypt śniegu :smile:
masz tu 2 dla przykładu:

ten:
Kod: Zaznacz cały
<head>
<script>
// Set the number of snowflakes (more than 30 - 40 not recommended)
var snowmax=30

// 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=1

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

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

// 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<=snowmax;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<=snowmax;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<=snowmax;i++) {
document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
}
if (browserok) {
window.onload=initsnow
}
</script>
</head>


oraz ten:
Kod: Zaznacz cały
<script language="JavaScript1.2">

/*
Snow Effect Script
Submitted by Altan d.o.o. (snow@altan.hr, http://www.altan.hr/snow/index.html)
Permission granted to Dynamicdrive.com to feature script in archive
For full source code to this script, visit http://dynamicdrive.com
*/


//Configure below to change URL path to the snow image
var snowsrc="http://img506.imageshack.us/img506/4899/snieg5cg.gif"
// Configure below to change number of snow to render
var no = 10;

var ns4up = (document.layers) ? 1 : 0; // browser sniffer
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;

var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 800, doc_height = 600;

if (ns4up||ns6up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}

dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();

for (i = 0; i < no; ++ i) {
dx[i] = 0; // set coordinate variables
xp[i] = Math.random()*(doc_width-50); // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20; // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random(); // set step variables
if (ns4up) { // set layers
if (i == 0) {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><a href=\"http://dynamicdrive.com/\"><img src='"+snowsrc+"' border=\"0\"></a></layer>");
} else {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><img src='"+snowsrc+"' border=\"0\"></layer>");
}
} else if (ie4up||ns6up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"></a></div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"></div>");
}
}
}

function snowNS() { // Netscape main animation function
for (i = 0; i < no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
dx[i] += stx[i];
document.layers["dot"+i].top = yp[i];
document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowNS()", 10);
}

function snowIE_NS6() { // IE and NS6 main animation function
for (i = 0; i < no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = ns6up?window.innerWidth : document.body.clientWidth;
doc_height = ns6up?window.innerHeight : document.body.clientHeight;
}
dx[i] += stx[i];
if (ie4up){
document.all["dot"+i].style.pixelTop = yp[i];
document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
}
else if (ns6up){
document.getElementById("dot"+i).style.top=yp[i];
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i]);
}
}
setTimeout("snowIE_NS6()", 10);
}

if (ns4up) {
snowNS();
} else if (ie4up||ns6up) {
snowIE_NS6();
}

</script>
Avatar użytkownika
Trystek
 
Posty: 716
Dołączył(a): Wt cze 12, 07 22:40
Lokalizacja: Bydgoszcz

Postprzez Camillo » N gru 30, 07 01:30

Dzx :) Tylko, gdzie mam to wkleić? Bo jak edytuję plik index.html ti wklejam ale jak widzę podgląd to jest tylko napisane a nie ma żadnego śniegu. W którym to miejscu mam wkleić?
Camillo
 
Posty: 37
Dołączył(a): N gru 30, 07 00:59

Postprzez Trystek » N gru 30, 07 01:32

Camillo napisał(a):gdzie mam to wkleić?

np na końcu pliku :P
Camillo napisał(a):Bo jak edytuję plik index.html ti wklejam ale jak widzę podgląd to jest tylko napisane a nie ma żadnego śniegu.

to zapisz plik (na kompie) i otwórz przeglądarką :roll:
Avatar użytkownika
Trystek
 
Posty: 716
Dołączył(a): Wt cze 12, 07 22:40
Lokalizacja: Bydgoszcz

Postprzez Camillo » N gru 30, 07 01:37

Nic z tego. Dałem na samym końcu. Zapisałem i wrzuciłem na serwer. Na stronie też był ten kod widoczny cały.
Camillo
 
Posty: 37
Dołączył(a): N gru 30, 07 00:59

Postprzez borowik96 » N gru 30, 07 09:52

kod powinien byc umieszczony między znacznikami <head> a </head>
borowik96
 
Posty: 31
Dołączył(a): Cz paź 25, 07 21:00

Postprzez le$ek » N gru 30, 07 10:20

A ja umieściłem ten skrypt w polu baner w nagłówku forum i mi działa.
le$ek
 
Posty: 57
Dołączył(a): Wt gru 25, 07 09:18
Lokalizacja: Marwica

Postprzez Trystek » N gru 30, 07 10:24

pierwszy skrypt jak widać musi być w head, a drugi w body :smile:
Avatar użytkownika
Trystek
 
Posty: 716
Dołączył(a): Wt cze 12, 07 22:40
Lokalizacja: Bydgoszcz

Postprzez Camillo » N gru 30, 07 19:36

To ja nie wiem. Nic mi nie wychodzi :(
Camillo
 
Posty: 37
Dołączył(a): N gru 30, 07 00:59

Postprzez le$ek » N gru 30, 07 22:48

camillo a spróbuj wrzucić ten skrypt do PA-ogólne-konfiguracja-strona główna-baner w nagłówku forum mi to działa.
le$ek
 
Posty: 57
Dołączył(a): Wt gru 25, 07 09:18
Lokalizacja: Marwica

Postprzez Camillo » N gru 30, 07 23:51

No właśnie, ja mam stronę html :)
Camillo
 
Posty: 37
Dołączył(a): N gru 30, 07 00:59

Postprzez le$ek » Pn gru 31, 07 09:09

Aha no to sory niewiedziałem.
le$ek
 
Posty: 57
Dołączył(a): Wt gru 25, 07 09:18
Lokalizacja: Marwica

Postprzez Neo » Pn gru 31, 07 10:59

Prowadzisz le$ek zbędną dyskusję.. Stosujcie się do schematu

pytanie/prośba o pomoc
odpowiedź/pomoc
Avatar użytkownika
Neo
 
Posty: 762
Dołączył(a): Pt kwi 06, 07 11:37
Lokalizacja: Bydgoszcz


Powrót do HTML

Copyright © 2007-2011 ugu.pl
Wszelkie prawa zastrzeżone.
Polityka prywatności