Скрипт падающих снежинок JS

Discussion in 'Болталка' started by mff, 16 Nov 2009.

  1. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    Поделитесь или помогите найти нормальный скрипт падающих снежинок. Только нужно чтобы не появлялась горизонтальная прокрутка при работе скрипта, как это часто бывает.

    С меня шестизначная аська.

    Спасибо. :)
     
    #1 mff, 16 Nov 2009
  2. Morozil_nikЁ

    Morozil_nikЁ Member

    Joined:
    25 Oct 2009
    Messages:
    0
    Likes Received:
    90
    Reputations:
    33
    Хм , вот что нашел : http://codeguru.ru/web/javascript/samples/%D0%B0%D0%BD%D0%B8%D0%BC%D0%B0%D1%86%D0%B8%D1%8F/%D0%B4%D0%B2%D0%B8%D0%B6%D1%83%D1%89%D0%B8%D0%B5%D1%81%D1%8F-%D0%BE%D0%B1%D1%8A%D0%B5%D0%BA%D1%82%D1%8B/%D0%BF%D0%B0%D0%B4%D0%B0%D1%8E%D1%89%D0%B8%D0%B9-%D1%81%D0%BD%D0%B5%D0%B3.html
     
    #2 Morozil_nikЁ, 16 Nov 2009
  3. -Unlocked-

    -Unlocked- Elder - Старейшина

    Joined:
    6 Dec 2008
    Messages:
    32
    Likes Received:
    222
    Reputations:
    33
    Code:
    <script type="text/javascript">

/******************************************
* Snow Effect Script- By Altan d.o.o. (http://www.altan.hr/snow/index.html)
* Visit Dynamic Drive DHTML code library (http://www.dynamicdrive.com/) for full source code
* Last updated Nov 9th, 05' by DD. This notice must stay intact for use
******************************************/
  
  //Configure below to change URL path to the snow image
  var snowsrc="snow.gif"
  // Configure below to change number of snow to render
  var no = 10;
  // Configure whether snow should disappear after x seconds (0=never):
  var hidesnowtime = 0;
  // Configure how much snow should drop down before fading ("windowheight" or "pageheight")
  var snowdistance = "pageheight";

///////////Stop Config//////////////////////////////////

  var ie4up = (document.all) ? 1 : 0;
  var ns6up = (document.getElementById&&!document.all) ? 1 : 0;

	function iecompattest(){
	return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
	}

  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 (ns6up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
  } else if (ie4up) {
    doc_width = iecompattest().clientWidth;
    doc_height = iecompattest().clientHeight;
  }

  dx = new Array();
  xp = new Array();
  yp = new Array();
  am = new Array();
  stx = new Array();
  sty = new Array();
  snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc
  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 (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 snowIE_NS6() {  // IE and NS6 main animation function
    doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
		doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")?  iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
    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();
      }
      dx[i] += stx[i];
      document.getElementById("dot"+i).style.top=yp[i]+"px";
      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";  
    }
    snowtimer=setTimeout("snowIE_NS6()", 10);
  }

	function hidesnow(){
		if (window.snowtimer) clearTimeout(snowtimer)
		for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
	}
		

if (ie4up||ns6up){
    snowIE_NS6();
		if (hidesnowtime>0)
		setTimeout("hidesnow()", hidesnowtime*1000)
		}

</script>
    Не?
     
    #3 -Unlocked-, 16 Nov 2009
  4. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    -Unlocked- потянет! Правда если уменьшить окно браузера, появляеться прокрутка внизу. Но если обновить, скрипт понимает ширину окна. Спасибо. Если ни чего не предложат лучше, отдам тебе шестерку :)
     
    #4 mff, 16 Nov 2009
  5. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    А вот нашел скрипт, он не требует графики:
    HTML:
    <script language="javascript">
var snowmax=45;
var snowcolor=new Array("#AAAACC","#DDDDFF","#CCCCDD","#F3F3F3","#F0FFFF");
var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS");
var snowletter="*";

// 0.3 to 2
var sinkspeed=0.6;
var snowmaxsize=40;
var snowminsize=10;

// 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;

//osw
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>
    но есть один косяк, снежинки летят не до конца странички. Как это исправить? :confused:
     
    #5 mff, 16 Nov 2009
  6. winlogon.exe

    winlogon.exe Active Member

    Joined:
    5 Jun 2009
    Messages:
    31
    Likes Received:
    129
    Reputations:
    13
    Вот самый лучший вариант по моему мнению)
    Демо: http://www.dynamicdrive.com/dynamicindex3/snow.htm
    PHP:
    <script type="text/javascript">

    //Configure below to change URL path to the snow image
    var snowsrc="snow.gif"
    // Configure below to change number of snow to render
    var no = 10;
    // Configure whether snow should disappear after x seconds (0=never):
    var hidesnowtime = 0;
    // Configure how much snow should drop down before fading ("windowheight" or "pageheight")
    var snowdistance = "pageheight";

    ///////////Stop Config//////////////////////////////////

    var ie4up = (document.all) ? 1 : 0;
    var     ns6up = (document.getElementById&&!document.all) ? 1 : 0;

    function     iecompattest(){
    return (    document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }

    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 (    ns6up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    } else if (    ie4up) {
    doc_width = iecompattest().clientWidth;
    doc_height = iecompattest().clientHeight;
    }

    dx = new Array();
    xp = new Array();
    yp = new Array();
    am = new Array();
    stx = new Array();
    sty = new Array();
    snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc
    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 (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     snowIE_NS6() { // IE and NS6 main animation function
    doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
    doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
    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();
    }
    dx[i] += stx[i];
    document.getElementById("dot"+i).style.top=yp[i]+"px";
    document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px"; 
    }
    snowtimer=setTimeout("snowIE_NS6()", 10);
    }

    function     hidesnow(){
    if (    window.snowtimer) clearTimeout(snowtimer)
    for (    i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
    }


    if (    ie4up||ns6up){
    snowIE_NS6();
    if (    hidesnowtime>0)
    setTimeout("hidesnow()", hidesnowtime*1000)
    }

    </script>
     
    #6 winlogon.exe, 16 Nov 2009
  7. -Unlocked-

    -Unlocked- Elder - Старейшина

    Joined:
    6 Dec 2008
    Messages:
    32
    Likes Received:
    222
    Reputations:
    33
    winlogon.exe, Я это опубликовал вторым постом... :/
     
    #7 -Unlocked-, 16 Nov 2009
  8. FaS

    FaS Elder - Старейшина

    Joined:
    3 Aug 2008
    Messages:
    64
    Likes Received:
    144
    Reputations:
    22
    народ эсли у кого эсть плз дайте скриптик нг для сайта чтобы отщитивал дни до нового года, не прост js, а какойто красивый флэш или ище чего :) оч нужен
     
    #8 FaS, 16 Nov 2009
  9. A_n_d_r_e_i

    A_n_d_r_e_i Active Member

    Joined:
    2 Sep 2009
    Messages:
    175
    Likes Received:
    250
    Reputations:
    27
    Кто-то дал код, а не обьяснил толком:

    [i][i][i][i][i][i][i][i][i][i][i][i][i][i]

    [COLOR=DarkOrange]желтый цвет[/COLOR], значения ширины и длины полета снежинок, их подредактируй(подгони под себя), и полоса прокрутки не будет появляться[/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i]
     
    #9 A_n_d_r_e_i, 16 Nov 2009
  10. A_n_d_r_e_i

    A_n_d_r_e_i Active Member

    Joined:
    2 Sep 2009
    Messages:
    175
    Likes Received:
    250
    Reputations:
    27
    http://depositfiles.com/files/t2009gq36
    а тут летят до конца странички, только полоса прокрутки появляется :(
     
    #10 A_n_d_r_e_i, 16 Nov 2009
  11. FaS

    FaS Elder - Старейшина

    Joined:
    3 Aug 2008
    Messages:
    64
    Likes Received:
    144
    Reputations:
    22
    помогите мну плз, ато в гуле ниче не нарыл норм)
     
    #11 FaS, 16 Nov 2009
  12. FaS

    FaS Elder - Старейшина

    Joined:
    3 Aug 2008
    Messages:
    64
    Likes Received:
    144
    Reputations:
    22
    Code:
    <script language="JavaScript1.2">  
grphcs=new Array(2)  
Image0=new Image();  
Image0.src=grphcs[0]="http://fantasyflash.ru/script/web/image/sneg1.gif";  
Image1=new Image();  
Image1.src=grphcs[1]="http://fantasyflash.ru/script/web/image/sneg1.gif";  
Amount=25;  
Ypos=new Array();  
Xpos=new Array();  
Speed=new Array();  
Step=new Array();  
Cstep=new Array();  
ns=(document.layers)?1:0;  
ns6=(document.getElementById&&!document.all)?1:0;  
if (ns){  
for (i = 0; i < Amount; i++){  
var P=Math.floor(Math.random()*grphcs.length);  
rndPic=grphcs[P];  
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");  
}  
}  
else{  
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');  
for (i = 0; i < Amount; i++){  
var P=Math.floor(Math.random()*grphcs.length);  
rndPic=grphcs[P];//osw  
document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');  
}  
document.write('</div></div>');  
}  
WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;  
WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;//fantasyflash.ru  
for (i=0; i < Amount; i++){  
Ypos[i] = Math.round(Math.random()*WinHeight);  
Xpos[i] = Math.round(Math.random()*WinWidth);  
Speed[i]= Math.random()*5+3;  
Cstep[i]=0;  
Step[i]=Math.random()*0.1+0.05;  
}  
function fall(){  
var WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;  
var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;  
var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;  
var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;  
for (i=0; i < Amount; i++){  
sy = Speed[i]*Math.sin(90*Math.PI/180);  
sx = Speed[i]*Math.cos(Cstep[i]);  
Ypos[i]+=sy;  
Xpos[i]+=sx;  
if (Ypos[i] > WinHeight){  
Ypos[i]=-60;  
Xpos[i]=Math.round(Math.random()*WinWidth);  
Speed[i]=Math.random()*5+3;  
}  
if (ns){  
document.layers['sn'+i].left=Xpos[i];  
document.layers['sn'+i].top=Ypos[i]+hscrll;  
}  
else if (ns6){  
document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i]);  
document.getElementById("si"+i).style.top=Ypos[i]+hscrll;  
}  
else{  
eval("document.all.si"+i).style.left=Xpos[i];  
eval("document.all.si"+i).style.top=Ypos[i]+hscrll;  
}  
Cstep[i]+=Step[i];  
}  
setTimeout('fall()',20);  
}  
window.onload=fall  
//-->  
</script>
    правда не знаю робит ли.
     
    #12 FaS, 16 Nov 2009
(You must log in or sign up to post here.)