jQuery飘落的枫叶

所属分类:其他-动画效果

 2621  14  查看评论 (4)
jQuery飘落的枫叶 ie兼容8
setInterval(function() {
    var f = $(document).width();
    var e = Math.random() * f - 300;// 枫叶的定位left值    
    var o = 0.2 + Math.random();// 枫叶的透明度   
    var fon = 10 + Math.random() * 10; // 枫叶大小    
    var l = e - 100 + 200 * Math.random();// 枫叶的横向位移    
    var k = 2000 + 5000 * Math.random();
    var deg = Math.random() * 360; // 枫叶的方向    
    $(d).clone().appendTo(".maplebg").css({
        left: e + "px",
        opacity: o,
        transform: "rotate(" + deg + "deg)",
        "font-size": fon,
    }).animate({
        top: "550px",// 枫叶飘落的高度     
        left: l + "px",
        opacity: 0.1,
    }, k, "linear", function() {
        $(this).remove()
    })
}, 1000)

首先直接贴出代码,注释就是使用方法,参数配置可相应调整

相关插件-动画效果

CSS 3D动画翻书

使用CSS 3D变换显示互动书籍。 在这里我们用到精装本和平装本两种类型的书设计.我们可以很容易的通过修改css,图片来达到您最终想要的效果。
  动画效果
 12162  47

超酷jQuery水波倒影特效插件

lake.js是一款可以制作水波倒影特效jQuery插件。
  动画效果
 5510  45

超级牛B的js效果

跟上一个心的形状用的类似的方法。不用我多说,看了就知道有多牛B了哦。可兼容手机。暂停之后一个手指拖动改变视角,两个手指可以调整视角的大小,三个手指可以移动。
  动画效果
 21725  34

JQuery随机文本Shuffle

JQuery的随机文本是一个轻量级的 jQuery插件能够打乱您的任何文本内容。易于使用,它提供了一组选项来定制它...
  动画效果
 6865  11

讨论这个项目(4)回答他人问题或分享插件使用方法奖励jQ币

    梦醒20120101,12:17 0
    2017/5/27 12:44:53

     var d = "<div class='maple'>??<div>"里面的枫叶图标是怎么来的

        忆枫0
        2017/5/28 17:33:25

        那个枫叶图标是个特殊字符

    回复
    菲雪 0
    2017/5/18 16:05:27

    厉害!学习啦!

    回复
    Moonlight 0
    2017/4/30 7:13:19
取消回复