Bạn có muốn phản ứng với tin nhắn này? Vui lòng đăng ký diễn đàn trong một vài cú nhấp chuột hoặc đăng nhập để tiếp tục.

Latest topics

» [sare] Trang chủ bảo trì.
by bnlock567 Thu Jul 18, 2019 1:10 pm

» Chia Sẻ Trang Chủ HTML - 3 Cái
by bnlock567 Thu Jul 18, 2019 1:06 pm

» Một số template dùng để làm trang ch
by bnlock567 Thu Jul 18, 2019 1:05 pm

» [Sare ] 1 trang chủ cũng BT
by bnlock567 Thu Jul 18, 2019 11:53 am

» [ FM ] Bảng thông báo đẹp
by bnlock567 Tue Jul 16, 2019 11:36 am

» "Bảng nổi" trog FM
by bnlock567 Tue Jul 16, 2019 11:31 am

» Chuyển Host upload ảnh
by dang02315 Fri Sep 02, 2016 12:32 am

» [ AUTO 2U ] PHIÊN BẢN 2.5.3 ( MỚI NHẤT )
by ngothithuyva Mon Sep 14, 2015 9:14 am

» [ AUTO 2U ] PHẦN MỀM BN2U - AUTO 2U MỚI NHẤT
by Xop Paseo Wed Sep 09, 2015 9:58 am

» [ AUTO 2U ] PHIÊN BẢN 2.5.2-NGÀY 24/10/2014
by chebienk5a Tue Sep 08, 2015 9:52 pm

» [ AUTO ] Tự nhảy game 2U
by chebienk5a Tue Sep 08, 2015 7:36 pm

» [ Bách chiến vô song 2 ] Cách đi phó bản ma giáo đàn 6-7 boss
by Admiin Mon Aug 24, 2015 5:40 pm

» [ LIST KEY 2U ] NGÀY 29/6/2015 PHIÊN BẢN 2.5.2 Trở Lên
by Pé Pun Sun Aug 23, 2015 5:01 pm

» [ AUTO 2U ] Demo auto up thân mật pet ver 1.0
by steven.gia119 Sun Aug 16, 2015 8:11 pm

» [ KEY Bảng Vàng ] NGÀY 05/03/2015 - ( Lần 3 )
by steven.gia119 Sun Aug 16, 2015 8:10 pm

» [ LIST KEY 2U ] NGÀY 24/10/2014 PHIÊN BẢN 2.5.1 Trở Lên
by chepchep800 Fri Aug 07, 2015 12:14 pm

» [ LIST KEY 2U ] NGÀY 18/2/2015 PHIÊN BẢN 2.5.2 Trở Lên
by chepchep800 Thu Aug 06, 2015 9:28 pm

» [ AUTO 2U ] Auto UP EXP UP vũ đạo Ver 2.5.3
by akikaneko Mon Jul 13, 2015 8:03 pm

» [ AUTO 2U ] PHIÊN BẢN 2.5.1 - NGÀY 15/9/2014
by ohellobeyeu Mon Jul 06, 2015 9:32 pm

» [ AUTO 2U ] UPDATE AUTO MỚI
by Admiin Sun Jul 05, 2015 4:35 pm

» Công thức ép chậu Khu vườn trên mây
by khanhkute Sat Jul 04, 2015 2:57 pm


    Javascript - Một số hiệu ứng tuyết rơi cho web (sưu tầm)

    Admiin
    Admiin
    NGƯỜI ĐẸP TRAI NHẤT
    NGƯỜI ĐẸP TRAI NHẤT


    Posts Posts : 786
    Points Points : 93568226
    Thanked Thanked : 72
    Tham Gia Tham Gia : 01/10/2010
    Tuổi Tuổi : 30
    Đến từ Đến từ : Nghệ An
    Tình trạng Tình trạng : Độc thân

      
     :

    Javascript - Một số hiệu ứng tuyết rơi cho web (sưu tầm) Empty Javascript - Một số hiệu ứng tuyết rơi cho web (sưu tầm)

    Bài gửi by Admiin Sun May 15, 2011 12:20 pm

    1 - Hiệu ứng 1
    - Hiệu ứng tuyết rơi sử dụng dấu * để làm tuyết, có thể thay đổi kích cỡ, màu sắc ở phần config
    Coppy đoạn code bên dưới và chèn vào dưới thẻ trong trang web của bạn

    Code:
    <script>
     // CREDITS: // Snowmaker Copyright (c) 2003 Peter Gehrig. All rights reserved.
     // Distributed by http://www.hypergurl.com // Permission given to use the script
     on webpages provided that this notice remains as is. // Set the number of snowflakes
     (more than 30 - 40 not recommended) var snowmax=35 // 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=22 // Set the minimal-size of your snowflaxes var snowminsize=8 //
     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=3  /////////////////////////////////////////////////////////////////////////// 
     // 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>

    2 - Hiệu ứng 2
    - Hiệu ứng tuyết rơi sử dụng ảnh
    - Tải hình ảnh tuyết rơi ở đây ( có nhiều kiểu để chọn )
    Code:
    http://www.mediafire.com/?g79le58ol8o5rer

    Code:
    <script>
     var SNOW_Picture = "/billeder/snow.gif";
    var SNOW_no = 15;

    var SNOW_browser_IE_NS = (document.body.clientHeight) ? 1 : 0;
    var SNOW_browser_MOZ = (self.innerWidth) ? 1 : 0;
    var SNOW_browser_IE7 = (document.documentElement.clientHeight) ? 1 : 0;

    var SNOW_Time;
    var SNOW_dx, SNOW_xp, SNOW_yp;
    var SNOW_am, SNOW_stx, SNOW_sty;
    var i, SNOW_Browser_Width, SNOW_Browser_Height;

    if (SNOW_browser_IE_NS)
    {
     SNOW_Browser_Width = document.body.clientWidth;
     SNOW_Browser_Height = document.body.clientHeight;
    }
    else if (SNOW_browser_MOZ)
    {
     SNOW_Browser_Width = self.innerWidth - 20;
     SNOW_Browser_Height = self.innerHeight;
    }
    else if (SNOW_browser_IE7)
    {
     SNOW_Browser_Width = document.documentElement.clientWidth;
     SNOW_Browser_Height = document.documentElement.clientHeight;
    }


    SNOW_dx = new Array();
    SNOW_xp = new Array();
    SNOW_yp = new Array();
    SNOW_am = new Array();
    SNOW_stx = new Array();
    SNOW_sty = new Array();

    for (i = 0; i < SNOW_no; ++ i)
    {
     SNOW_dx[i] = 0;
     SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-50);
     SNOW_yp[i] = Math.random()*SNOW_Browser_Height;
     SNOW_am[i] = Math.random()*20;
     SNOW_stx[i] = 0.02 + Math.random()/10;
     SNOW_sty[i] = 0.7 + Math.random();
     if (i == 0) document.write("<\div id=\"SNOW_flake"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><a href=\"http://www.peters1.dk\" target=\"_blank\"><\img src=\""+SNOW_Picture+"\" border=\"0\"></a><\/div>");
     else document.write("<\div id=\"SNOW_flake"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><\img src=\""+SNOW_Picture+"\" border=\"0\"><\/div>");
    }

    function SNOW_Weather()
    {

    for (i = 0; i < SNOW_no; ++ i)
    {
     SNOW_yp[i] += SNOW_sty[i];

     if (SNOW_yp[i] > SNOW_Browser_Height-50)
     {
     SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-SNOW_am[i]-30);
     SNOW_yp[i] = 0;
     SNOW_stx[i] = 0.02 + Math.random()/10;
     SNOW_sty[i] = 0.7 + Math.random();
     }

     SNOW_dx[i] += SNOW_stx[i];

     document.getElementById("SNOW_flake"+i).style.top=SNOW_yp[i]+"px";
     document.getElementById("SNOW_flake"+i).style.left=SNOW_xp[i] + SNOW_am[i]*Math.sin(SNOW_dx[i])+"px";
    }

    SNOW_Time = setTimeout("SNOW_Weather()", 10);

    }

    SNOW_Weather();
     </script>


    3 - Hiệu ứng 3
    - Hiệu ứng tuyết bay theo chiều gió (bay theo con trỏ chuột)
    Code:
    <script type="text/javascript" name="snow.js">
    if  ((document.getElementById) &&
    window.addEventListener || window.attachEvent){

    (function(){

    //Configure here.

    var num = 60;  //Number of flakes
    var timer = 30; //setTimeout speed. Varies on different comps

    //End.

    var y = [];
    var x = [];
    var fall = [];
    var theFlakes = [];
    var sfs = [];
    var step = [];
    var currStep = [];
    var h,w,r;
    var d = document;
    var pix = "px";
    var domWw = (typeof window.innerWidth == "number");
    var domSy = (typeof window.pageYOffset == "number");
    var idx = d.getElementsByTagName('div').length;

    if (d.documentElement.style &&
    typeof d.documentElement.style.MozOpacity == "string")
    num = 12;

    for (i = 0; i < num; i++){
    sfs[i] = Math.round(1 + Math.random() * 1);

    document.write('<div id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:'
    +sfs[i]+'px;height:'+sfs[i]+'px;background-color:#ffffff;font-size:'+sfs[i]+'px"><\/div>');

    currStep[i] = 0;
    fall[i] = (sfs[i] == 1)?
    Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
    step[i] = (sfs[i] == 1)?
    0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
    }


    if (domWw) r = window;
    else{
     if (d.documentElement &&
     typeof d.documentElement.clientWidth == "number" &&
     d.documentElement.clientWidth != 0)
     r = d.documentElement;
     else{
     if (d.body &&
     typeof d.body.clientWidth == "number")
     r = d.body;
     }
    }


    function winsize(){
    var oh,sy,ow,sx,rh,rw;
    if (domWw){
     if (d.documentElement && d.defaultView &&
     typeof d.defaultView.scrollMaxY == "number"){
     oh = d.documentElement.offsetHeight;
     sy = d.defaultView.scrollMaxY;
     ow = d.documentElement.offsetWidth;
     sx = d.defaultView.scrollMaxX;
     rh = oh-sy;
     rw = ow-sx;
     }
     else{
     rh = r.innerHeight;
     rw = r.innerWidth;
     }
    h = rh - 2; 
    w = rw - 2;
    }
    else{
    h = r.clientHeight - 2;
    w = r.clientWidth - 2;
    }
    }


    function scrl(yx){
    var y,x;
    if (domSy){
     y = r.pageYOffset;
     x = r.pageXOffset;
     }
    else{
     y = r.scrollTop;
     x = r.scrollLeft;
     }
    return (yx == 0)?y:x;
    }


    function snow(){
    var dy,dx;

    for (i = 0; i < num; i++){
     dy = fall[i];
     dx = fall[i] * Math.cos(currStep[i]);

     y[i]+=dy;
     x[i]+=dx;

     if (x[i] >= w || y[i] >= h){
     y[i] = -10;
     x[i] = Math.round(Math.random() * w);
     fall[i] = (sfs[i] == 1)?
     Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
     step[i] = (sfs[i] == 1)?
     0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
     }
     
     theFlakes[i].top = y[i] + scrl(0) + pix;
     theFlakes[i].left = x[i] + scrl(1) + pix;

     currStep[i]+=step[i];
    }
    setTimeout(snow,timer);
    }


    function init(){
    winsize();
    for (i = 0; i < num; i++){
     theFlakes[i] = document.getElementById("flake"+(idx+i)).style;
     y[i] = Math.round(Math.random()*h);
     x[i] = Math.round(Math.random()*w);
    }
    snow();
    }


    if (window.addEventListener){
     window.addEventListener("resize",winsize,false);
     window.addEventListener("load",init,false);

    else if (window.attachEvent){
     window.attachEvent("onresize",winsize);
     window.attachEvent("onload",init);
    }

    })();
    }//End.
    </script>

      Hôm nay: Fri Apr 26, 2024 7:41 pm