• 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 参数解析

    参数名称 解析
    topSpacing default 0
    bottomSpacing default 0

    4. parallax.js

    4.1 轻量级视差引擎

  • 相关阅读:
    编写一个静态类MyExtensions(看不太懂以后应该学到吧)
    c#
    HTML-表格与表单
    VS学习笔记3 (0413)
    HTML 个人简历模板简易版
    C#语言之二维数组
    C#学习笔记---函数 的理解及总结(入门级)
    c#语言-Split拆分
    c#学习之数组 36选7随机数不重复/折半取余
    VS学习笔记--数组
  • 原文地址:https://www.cnblogs.com/leijing0607/p/8747661.html
Copyright © 2020-2023  润新知