Velocity.js2

最新推荐文章于 2019-10-15 15:02:29 发布
最新推荐文章于 2019-10-15 15:02:29 发布
阅读量340 收藏
点赞数 1
分类专栏： 前端 文章标签： javascript html css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/finger__/article/details/71893696
版权
需求，当刷新页面的时候，会有一个卡片伴随的入场动画进入到页面，当点击卡片上的按钮的时候卡片会有一个出场 的动画，卡片的另外一面会有一个入场动画，同时卡片上的四张图片也会有一个弹出式的效果。
实现动画的手段是多种多样的，比如flash，jquery，css3，这边使用Velocity.js

* {
    margin: 0;
    padding
}//记得全局清除内外边距

正面效果
.container {
    width: 320px;
    height: 420px;
    border: 1px solid #ddd;
    background: #fff;
    margin: 10px auto;
    position: relative;
}
.box {
    position: relative;    
}
.box #top_back_img {
    width: 320px;
    height: 213px;
}
.box #head_img {
    position: absolute;
    width: 96px;
    height: 96px;
    left: 50%;
    top: 213px;
    border-radius: 50%;
    margin-left: -48px;
    margin-top: -48px;
}
.inner {
    margin-top: 66px; /*header.height*0.5 + 26px*/
    text-align: center;
}
.inner span {
    font-size: 14px;
    color: #b4b4b4;
    display: block;
    margin-top: 5px;
}
.inner .bottom_button {
    width: 180px;
    height: 45px;
    inline-height: 45px;
    margin-top: 25px;
    background-color: #5677fc;
    color: #fff;
    border-radius: 5px;
    display: inline-block;
    cursor: pointer;
    transition: background-color 0.2s;
}
.inner .bottom_button:hover {
    background-color: #3b50ce;
}

下面着手背面效果
背面效果
<div class="back_box">
            <div class="close">&times;</div>
            <h3>Tabbits Velocity.js Demo</h3>
            <span>我是小进</span>
            <img src="imgs/1.jpg" alt="">
            <img src="imgs/2.jpg" alt="">
            <img src="imgs/3.jpg" alt="">
            <img src="imgs/4.jpg" alt="">
        </div>

.back_box {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.back_box .close {
    position: absolute;
    top: 0px;
    right: 10px;
    color: #999;
    font-size: 24px;
    font-family: helvetica;
}
.back_box .close:hover {
    color: #111;
    cursor: pointer;
}
.back_box h3 {
    margin-top: 15px;
}
.back_box span {
    display: block;
    font-size: 12px;
    color: #999;
    margin-top: 20px;
    margin-bottom: 20px;
}
.back_box img {
    width: 125px;
    height: 125px;
    display: inline-block;
    margin: 10px;
}



动画效果
1.入场动画
(function($) {
    //将DOM中的元素选出来
    var container = $(".container");
    var box = $(".box");
    var head_img = $("#head_img");
    var back = $(".back");
    var open = $(".bottom_button");
    var close = $(".close");
    var imgs = back.find("img");//z这边的imgs将是一个数组

    // 首先入场动画
    //1.自定义动画，即从下往上入场
    $.Velocity.RegisterEffect("Tabbits.fromButtonToTop",{
        defaultDuration: 500,
        //定义数组calls,calls里面的每一个元素也是数组
        calls: [
            [{opacity:[1,0],translateY:[0,100]}]
            //{opacity:[1,0]中的1指的是动画结束时的状态，0指的是动画开始时的状态
            //Y方向上的位移使用translateY，translateY:[0,100]，结束的时候为0，开始的时候向下100px
        ]
    });//至此，自定义动画暂告一段落

    //2.定义一个sequnence动画序列
    var seqInit = [{
        elements: container,//每个元素都有elements
        properties: "Tabbits.fromButtonToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            delay: 300
        }
    },{
        elements: box,//每个元素都有elements
        properties: "Tabbits.fromButtonToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            // delay: 300 //box不需要delay
        }
    },{
        elements: head_img,//每个元素都有elements
        properties: "Tabbits.fromButtonToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            delay: 60
        }
    }
    ];
    //3.调用RunSequence函数将自定义动画跑起来
    $.Velocity.RunSequence(seqInit);
})(jQuery);


改进
动画是依次执行的，也就是这个sequence默认的是依次执行的。怎么让他同时执行呢？其实options里面还有一个属性sequenceQueue，将它设置为false.
var seqInit = [{
        elements: container,//每个元素都有elements
        properties: "Tabbits.fromButtonToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            delay: 300
        }
    },{
        elements: box,//每个元素都有elements
        properties: "Tabbits.fromButtonToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            // delay: 300 //box不需要delay
             sequneceQueue: false
        }
    },{
        elements: head_img,//每个元素都有elements
        properties: "Tabbits.fromButtonToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
             sequneceQueue: false,
            delay: 60
        }
    }
    ];

2.按钮点击动画
按钮点击之后，首先container要向下消失，box也要向下消失，消失完之后container又会出现，back出现，back_img还会有弹出式的动画，一共是有5个序列让他们串联起来。
首先定义由上到下的出场动画Tabbits.FromTopToButtom
Tabbits.FromTopToButtom也很简单，将从下往上的自定义动画 Tabbits.fromButtonToTop的始末值对换即可。
// 4.自定义出场动画，Y轴上的变化
    $.Velocity.RegisterEffect("Tabbits.fromTopToButtom",{
        defaultDuration: 200,        //时间稍微改短一下，收尾快点
        calls: [
            [{opacity: [0,1], translateY: [100,0]}]
        ]
    });
    //5.自定义back_img动画，有由小变到原来的尺寸，用scale
    $.Velocity.RegisterEffect("Tabbits.back_imgIn",{
        defaultDuration: 20000,
        calls: [
            [{opacity: [1,0], scale: [1,0.3]}]  //以0.2倍大小到1倍大小的动画出现
        ]
    });

下面定义sequence

//6.定义点击按钮动画的sequence动画序列
    var sequenceButtonClick = [{
        elements: container,
        properties: "Tabbits.fromTopToButtom",
        options: {
            sequenceQueue: false,
            delay: 300
        }
    },{//正面出场
        elements: box,
        properties: "Tabbits.fromTopToButtom",
        options: {
            sequenceQueue: false
        }
    },{//容器重新入场
        elements: container,
        properties: "Tabbits.fromButtonToTop",//再让container进来
    },{//背面入场
        elements: back_box,
        properties: "Tabbits.fromButtonToTop",
        options: {
            sequenceQueue: false
        }
    },{//背面图片入场
        // elememts: imgs,
        // properties: "Tabbits.back_imgIn",
        elements: back_box_imgs,
        properties: "Tabbits.back_imgIn",
        options: {
            sequenceQueue: false
        }
    }];

    //3.调用RunSequence函数将自定义动画跑起来
    $.Velocity.RunSequence(sequenceInit);
    open.on('click',function(){
        $.Velocity.RunSequence(sequenceButtonClick);
    });
但是现在点击按钮是没有效果的，为什么？
这是因为样式的问题，这个demo有正面，有背面， 正面的上面有背面，尽管将背面透明度设为0，也就是说背面是覆盖在正面之上的，所以点击的时候是作用在背面，或者说根本就没有点到按钮，很好解决，将正面的优先级提高，z-index: 2;就好了

3.关闭按钮
//7.自定义back_img出场动画
    $.Velocity.RegisterEffect("Tabbits.back_imgOut",{
        defaultDuration: 1000,
        calls: [
            [{opacity: [0,1],scale: [0.3,1]}]
        ]
    });
下面定义关闭按钮的sequence动画序列
//8.定义关闭按钮的sequence动画序列
    var sequenceClose = [{
        elements: back_box_imgs,
        properties: "Tabbits.back_imgOut"
    },{
        elements: container,
        properties: "Tabbits.fromTopToBottom",
        options: {
            sequenceQueue: false,
            delay: 3000
        }
    },{//背面出场
        elements: back_box,
        properties: "Tabbits.fromTopToBottom",
        options: {
            sequenceQueue: false
        }
    },{//容器重新入场
        elements: container,
        properties: "Tabbits.fromBottomToTop",//再让container进来
    },{//正面入场
        elements: box,
        properties: "Tabbits.fromBottomToTop",
        options: {
            sequenceQueue: false
        }
    }];

close.on('click',function() {
        $.Velocity.RunSequence(sequenceClose);
    });
    

总结
使用Velocity.js做动画是非常简单的，尤其是在 动画序列 的场景（A动完B动，B动完C动……）
1、Velocity.js的特性： 在浏览器/兼容性方面和移动端性能方面做了优化
2、Velocity.js的用法
3、JS插件的学习方法（3步）： 官网了解、案例运行、熟悉细节
代码小结
html：
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>velocity.js_demo</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type="text/javascript" src="js/jquery-3.2.1.js"></script>
    <!-- 下面引入Velocity的两个库 -->
    <script type="text/javascript" src="js/velocity.min.js"></script>
    <script type="text/javascript" src="js/velocity.ui.min.js"></script>
</head>
<body>
    <div class="container">
        <div class="box">
            <img id="top_back_img" src="imgs/back.jpg" alt="">
            <img id="head_img" src="imgs/xiaojin.jpg" alt="">
            <div class="inner">
                <h3>Tabbits Velocity.js Demo</h3>
                <span>我是小进</span>
                <button class="bottom_button">快进来嘛</button>
            </div>
        </div>
        <div class="back_box">
            <div class="close">&times;</div>
            <h3>Tabbits Velocity.js Demo</h3>
            <span>我是小进</span>
            <img src="imgs/1.jpg" alt="">
            <img src="imgs/2.jpg" alt="">
            <img src="imgs/3.jpg" alt="">
            <img src="imgs/4.jpg" alt="">
        </div>
    </div>
    <script type="text/javascript" src="js/script.js"></script>
</body>
</html>

css：
@charset "utf-8";

* {
    margin: 0;
    padding: 0;
}
.container {
    width: 320px;
    height: 420px;
    border: 1px solid #ddd;
    background: #fff;
    margin: 10px auto;
    position: relative;
}
.box {
    position: relative;    
    z-index: 2;
}
.box #top_back_img {
    width: 320px;
    height: 213px;
}
.box #head_img {
    position: absolute;
    width: 96px;
    height: 96px;
    left: 50%;
    top: 213px;
    border-radius: 50%;
    margin-left: -48px;
    margin-top: -48px;
}
.inner {
    margin-top: 66px; /*header.height*0.5 + 26px*/
    text-align: center;
}
.inner span {
    font-size: 14px;
    color: #b4b4b4;
    display: block;
    margin-top: 5px;
}
.inner .bottom_button {
    width: 180px;
    height: 45px;
    inline-height: 45px;
    margin-top: 25px;
    background-color: #5677fc;
    color: #fff;
    border-radius: 5px;
    display: inline-block;
    cursor: pointer;
    transition: background-color 0.2s;
}
.inner .bottom_button:hover {
    background-color: #3b50ce;
}

/*
.box {
    display: none;
}*/


.back_box {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.back_box .close {
    position: absolute;
    top: 0px;
    right: 10px;
    color: #999;
    font-size: 24px;
    font-family: helvetica;
}
.back_box .close:hover {
    color: #111;
    cursor: pointer;
}
.back_box h3 {
    margin-top: 15px;
}
.back_box span {
    display: block;
    font-size: 12px;
    color: #999;
    margin-top: 20px;
    margin-bottom: 20px;
}
.back_box img {
    width: 125px;
    height: 125px;
    display: inline-block;
    margin: 10px;
}

.container,.box,.head_img,.back_box,.back_box img {
    opacity: 0.0;
}

js：
(function($) {

//1.定义变量（动画元素，事件变量比如按钮）

    // 将DOM中的元素选出来
    var container = $(".container");
    var box = $(".box");
    var head_img = $("#head_img");
    var back_box = $(".back_box");
    var open = $(".bottom_button");
    var close = $(".close");
    var back_box_imgs = back_box.find("img");//z这边的imgs将是一个数组

//2.自定义动画（入场动画，出场动画，背面图片单独的入场动画，背面图片单独的出场动画）

    // 首先入场动画
    //2.自定义动画，即从下往上入场，Y轴上的变化
    $.Velocity.RegisterEffect("Tabbits.fromBottomToTop",{
        defaultDuration: 500,
        //定义数组calls,calls里面的每一个元素也是数组
        calls: [
            [{opacity:[1,0], translateY:[0,100]}]
            //{opacity:[1,0]中的1指的是动画结束时的状态，0指的是动画开始时的状态
            //Y方向上的位移使用translateY，translateY:[0,100]，结束的时候为0，开始的时候向下100px
        ]
    });
    // 5.自定义出场动画，Y轴上的变化
    $.Velocity.RegisterEffect("Tabbits.fromTopToBottom",{
        defaultDuration: 200,        //时间稍微改短一下，收尾快点
        calls: [
            [{opacity: [0,1], translateY: [100,0]}]
        ]
    });
    //6.自定义back_img入场动画，有由小变到原来的尺寸，用scale
    $.Velocity.RegisterEffect("Tabbits.back_imgIn",{
        defaultDuration: 1000,
        calls: [
            [{opacity: [1,0], scale: [1,0.3]}]  //以0.2倍大小到1倍大小的动画出现，注意始终值别弄反了，尤其是opacity弄反了直接看不来哦效果
        ]
    });
    // $.Velocity.RegisterEffect("Tabbits.back_imgIn",{
    //         defaultDuration: 200,        //时间稍微改短一下，收尾快点
    //         calls: [
    //             [{opacity: [1,0], scale: [1,0.3]}]
    //         ]
    //     });

    //8.自定义back_img出场动画
    $.Velocity.RegisterEffect("Tabbits.back_imgOut",{
        defaultDuration: 3000,
        calls: [
            [{opacity: [0,1],scale: [0.3,1]}]
        ]
    });

//3.sequence动画序列（入场动画序列、点击按钮出场序列和入场序列、点击关闭的入场和出场序列）

    //3.定义入场动画sequnence动画序列
    var sequenceInit = [{
        elements: container,//每个元素都有elements
        properties: "Tabbits.fromBottomToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            delay: 300
        }
    },{
        elements: box,//每个元素都有elements
        properties: "Tabbits.fromBottomToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            // delay: 300 //box不需要delay
            sequneceQueue: false
        }
    },{
        elements: head_img,//每个元素都有elements
        properties: "Tabbits.fromBottomToTop",//properties使用上面的自定义动画
        //还有options，不希望页面刚打开动画就开始
        options: {
            sequneceQueue: false,
            delay: 60
        }
    }];

    //7.定义点击按钮动画的sequence动画序列
    var sequenceButtonClick = [{
        elements: container,
        properties: "Tabbits.fromTopToBottom",
        options: {
            sequenceQueue: false,
            delay: 300
        }
    },{//正面出场
        elements: box,
        properties: "Tabbits.fromTopToBottom",
        options: {
            sequenceQueue: false
        }
    },{//容器重新入场
        elements: container,
        properties: "Tabbits.fromBottomToTop",//再让container进来
    },{//背面入场
        elements: back_box,
        properties: "Tabbits.fromBottomToTop",
        options: {
            sequenceQueue: false
        }
    },{//背面图片入场
        // elememts: imgs,
        // properties: "Tabbits.back_imgIn",
        elements: back_box_imgs,
        properties: "Tabbits.back_imgIn",
        options: {
            sequenceQueue: false
        }
    }];

    //9.定义关闭按钮的sequence动画序列
    var sequenceClose = [{
        elements: back_box_imgs,
        properties: "Tabbits.back_imgOut"
    },{
        elements: container,
        properties: "Tabbits.fromTopToBottom",
        options: {
            sequenceQueue: false,
            delay: 3000
        }
    },{//背面出场
        elements: back_box,
        properties: "Tabbits.fromTopToBottom",
        options: {
            sequenceQueue: false
        }
    },{//容器重新入场
        elements: container,
        properties: "Tabbits.fromBottomToTop",//再让container进来
    },{//正面入场
        elements: box,
        properties: "Tabbits.fromBottomToTop",
        options: {
            sequenceQueue: false
        }
    }];

//4.事件绑定（在相应的事件发生的时候跑相应的动画序列）

    //4.调用RunSequence函数将自定义动画跑起来
    $.Velocity.RunSequence(sequenceInit);
    open.on('click',function() {
        $.Velocity.RunSequence(sequenceButtonClick);
    });
    close.on('click',function() {
        $.Velocity.RunSequence(sequenceClose);
    });

})(jQuery);
finger__
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jquery一些技巧总结
思诚^_^
09-30 1012
禁用页面的右击菜单 $(function(){ $(document).on('contextmenu',function(e){ return false; }); }); 新窗口打开页面 $(function(){ //例子1:href="http://"的超链接将会在新窗口打开链接
velocity.min.js
09-07
利用velocity来定义动画序列，可以直接使用velocity.js中预定义动画开发自己的网页动画，也可以利用velocity.js自定义动画
Velocity工作原理解析和优化
weixin_34080571的博客
10-25 421
在MVC开发模式下，View离不开模板引擎，在Java语言中模板引擎使用得最多是JSP、Velocity和FreeMarker，在MVC编程开发模式中，必不可少的一个部分是V的部分。V负责前端的页面展示，也就是负责生产最终的HTML，V部分通常会对应一个编码引擎，当前众多的MVC框架都已经可以将V部分独立开来，可以与众多的模板引擎集成。 Velocity...
【译】velocity
weixin_30810239的博客
10-02 120
本文原文地址：http://davidwalsh.name/intro-javascript-animation 就像许多开发者确信的那样，在Web上使用CSS实现动画并不是唯一的方式，我们也可以使用JS来实现，并且JS还有一些CSS无法替代的优势。 然而抛开JS而选择CSS来实现动画，将以样式表内容膨胀，丧失对动画时间的控制为代价，并且无法灵活地实现基于物理运动模型的动画设计。 不要误导我！...
velocity.js:js 动作插件
05-20
velocity.js$element.velocity({width: "500px", property2: value2}, {/* Velocity's default options */duration: 400,easing: "swing",queue: "",begin: undefined,progress: undefined,complete: undefined,...
JavaScript模板引擎Velocity.js.zip
07-18
Velocity.js 是velocity模板语法的javascript实现。Velocity 是基于Java的模板引擎，广泛应用在阿里集 体各个子公司。Velocity模板适用于大量模板使用的场景，支持复杂的逻辑运算，包含 基本数据类型、变量赋值和...
velocity.js学习（一）
ES716
01-06 908
下载地址：https://github.com/julianshapiro/velocity 官网地址：http://www.julian.com/research/velocity/ 简单示例：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>velocity动画</
一统江湖的大前端（8）- velocity.js 运动的姿势(上)
华为云官方博客
10-15 1969
【摘要】 介绍CSS动画和JS动画的基本特点，以及轻量级动画库velocity.js的基本用法。 示例代码托管在：http://www.github.com/dashnowords/blogs 博客园地址：《大史住在大前端》原创博文目录 一. CSS动画 和 JS动画 Web动画的本质是元素状态改变造成的样式变更，CSS动画和JS动画的区别并不是由语言来决定的，而是由两者的特点和适用场景来...
$.animate()与Velocity.js区别
Hero4399的博客
02-23 751
1、jQuery animate()方法//通过改变元素的高度，对元素应用动画： ​ $("button").click(function(){ $("#box").animate({height:"300px"}); });定义和用法animate() 方法执行 CSS 属性集的自定义动画。该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。只...
velocityJS 动画使用方法
独孤九剑
05-20 1851
常用的属性和方法 都中文注释了 相信大家一看就会明白。可以复制代码到本地直接运行看到效果 *{margin:0;padding:0;} .box{width:300px;height:200px;overflow: auto;}
Velocity.js 中文文档
qyjandroid的专栏
01-10 1700
概述 Velocity 是一个简单易用、高性能、功能丰富的轻量级JS动画库。它能和 jQuery 完美协作，并和$.animate()有相同的 API， 但它不依赖 jQuery，可单独使用。 Velocity 不仅包含了 $.animate() 的全部功能， 还拥有：颜色动画、转换动画(transforms)、循环、 缓动、SVG 动画、和 滚动动画 等特色功能。
velocity--Feature 特色
qyjandroid的专栏
01-10 1027
Feature 特色 Velocity 提供了一些特色动画功能。 1. Transforms Velocity 支持2D/3D变换动画， 比如translate, scale, rotate, skew等。 JavaScript $element.velocity({ translateX: "200px", rotateZ: "45deg" });
Velocity.js 动画框架
kangkang_style的博客
03-26 2065
网页的交互动效大概分为 css动画，js动画 Animate.css属于css动画框架，Velocity.js属于js动画框架 css动画的优点： 不用进行计算和更改dom 会显得非常流畅。 js动画的优点： 没有css那样的局限性，可以实现更多的功能和动效 安装： npm install velocity-animate 使用方法： dom.velocity(...
$ is not a function 的问题的解决方法
热门推荐
qq_34710612的博客
09-28 3万+
      这几天做项目，有一个突发的问题，就是明明jQuery导进去了，就是报错$ is not a function 的问题，我前段用的是easyUI，想要给日期赋值，每次都错误，慢慢一个一个的更改js,发现了和引入的js的先后顺序有关系，首先不管引入什么js,jquery这个必须放在首位，这样确保所有的文件都能成功，因为引进来很多的js,有时候很多东西都重复了，导致覆盖了原有的一些基本属性。...
velocity.js 基础
多啦的博客
01-02 1265
概述Velocity 是一个简单易用、高性能、功能丰富的轻量级JS动画库。它能和 jQuery 完美协作，并和$.animate()有相同的 API， 但它不依赖 jQuery，可单独使用。 Velocity不仅包含了 $.animate() 的全部功能， 还拥有：颜色动画、转换动画(transforms)、循环、 缓动、SVG 动画、和 滚动动画 等特色功能。中文文档在此。它比 $.animate
一个高性能js动画库velocity.js简介
cpvwka5574的博客
06-29 300
一、为什么是velocity不是jquery 时下，如何快速制作js动效，许多人可能会首先想到使用jquery。jquery的就是如此流行。使用jquery制作的各种动效在网络上也非常丰富。jquery的优点不...
Velocity.js错误：Velocity is not defined
陈小峰（iefreer）的专栏
10-27 5105
在使用Velocity.js时报错Velocity is not defined.原因是加载了jQuery。
$ is not a function解决办法
Nobita
05-26 2万+
$ is not a function // $(function () { // $('.portfolio-two-item').click(function () { // var video_path = $(this).data('src'); // layer.open({ // type: 2, // t...
html彩色风车,Velocity.js+CSS3 彩色风车（Pinwheel）
最新发布
05-30
这个彩色风车使用了Velocity.js动画库来实现旋转动画。可以在HTML文件中引入Velocity.js库，然后在CSS中使用animation属性来指定动画效果。其中，@keyframes规则定义了动画的关键帧，transform属性定义了旋转的角度...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值