js 技巧总结

插件解析


我们理解您需要更便捷更高效的工具记录思想,整理笔记、知识,并将其中承载的价值传播给他人,Cmd Markdown 是我们给出的答案 —— 我们为记录思想和分享知识提供更专业的工具。 您可以使用 Cmd Markdown:

  • Placeholdem插件
  • wow.min.js插件
  • 撰写发布技术文稿(代码支持)
  • 撰写发布学术论文(LaTeX 公式支持)

1. Placeholdem插件解析

1.1 功能说明
  • Placeholdem is a JavaScript plugin that animates placeholder carets on inputs and textareas. The placeholder value will incrementally delete on focus, and restore on blur.
1.1 使用方法
第一步:引用 JS 文件
第二步:在input和textarea中设置placeholder属性

第三步:Placeholdem(document.querySelectorAll('[placeholder]'));

2. wow.min.js插件解析

2.1 功能说明
  • 在页面向下滚动的时候,触发对应的动画效果。依赖animate.css,支持animate.css的各种动画效果。
2.2 使用方法
第一步:引入
    <link rel="stylesheet" href="css/animate.min.css">
    <script type="text/javascript" src="wow.min.js"></script>
第二步:data-wow-duration(动画持续时间)和data-wow-delay(动画延迟时间)
    <div class="wow slideInLeft" data-wow-duration="2000ms" data-wow-delay="5000ms"></div>

第三步:执行代码
    new WOW().init();

3. jquery.sticky.js

2.1 功能说明
  • Sticky is a jQuery plugin that gives you the ability to make any element on your page always stay visible.
  • 当导航栏不位于顶部,但是滑动之后若想导航栏一直位于顶部,可以使用该方法
2.2 使用方法
第一步:引入
    <script src="jquery.js"></script>
    <script src="jquery.sticky.js"></script>

第二步:执行代码
    $(document).ready(function(){
        $("#sticker").sticky({topSpacing:0});
      });
2.3 参数解析
参数名称解析
topSpacingdefault 0
bottomSpacingdefault 0

4. parallax.js

4.1 轻量级视差引擎

转载于:https://www.cnblogs.com/leijing0607/p/8747661.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值