雪花飘落特效

雪花飘落特效

只需要简单加载一个JS 不需要复杂的去加载CSS。或者别的

直接上代码 把这个放进头部就可以了

  /// <reference path="jquery-1.10.2.min.js" />
  ///
  ///
  var minSize = 5;
  var maxSize = 20;
  var newOn = 280;
  var flake = $("<div></div>").css({ "position": "absolute", "top": "-50px" }).html("❅");
  $(function () {


    var documentHeight = $(document).height();
    var documentWidth = $(document).width();
    setInterval(function () {
    var startPositionLeft = Math.random() * documentWidth;
    var sizeFlake = minSize + Math.random() * maxSize;
    var endPositionLeft = Math.random() * documentWidth;
    var durationFall = documentHeight * 15 + Math.random() * 3000;
    var startOpacity = 0.7 + 0.3 * Math.random();
    var endOpacity = 1.5 * Math.random();
    flake.clone().appendTo($("body")).css({
        "left": startPositionLeft,
        "opacity": startOpacity,
        "font-size": sizeFlake,
        "color": "#aadff1"
    }).animate({
        "top": documentHeight - 40,
        "left": endPositionLeft,
        "opacity": endOpacity
    }, durationFall, function () {
        $(this).remove();
    });
    }, newOn);
    });

记得加载jquery 如果有加载就不需要再加载了!

效果如下

雪花飘落特效


版权属于:admin 所有,转载请注明文章来源。

本文链接: https://www.taozi1.com/16531.html

赞 (0)
您的大名:
万水千山总是情,给个打赏行不行。 打赏

评论区

发表评论

21+10=?

暂无评论,要不来一发?

回到顶部