酷炫的文字遮罩插件-ANIMATED KNOCKOUT LETTERS

所属分类:媒体-图像

 31968  335  查看评论 (4)
分享到微信朋友圈
X
酷炫的文字遮罩插件-ANIMATED KNOCKOUT LETTERS ie兼容10

不兼容ie浏览器

使用步骤

1、引入以下的js和css文件

<script src="jquery.min.js"></script>
<script src="jquery.lettering.js"></script>


2、在head标签中加入以下js代码

<script>
    // DOM Ready
    $(function() {
        $("#poster h1, #poster p").lettering();
        $("#poster p span").each(function() {
            $(this).css({
                top: -(Math.floor(Math.random() * 1001) + 1500),
                left: Math.floor(Math.random() * 1001) - 500,
            });
        });
        setTimeout(function() {
            $('html').addClass("step-one");
        },
        1000);
        setTimeout(function() {
            $('html').addClass("step-two");
        },
        3000);
    });
</script>


3、在body标签中加入以下格式的html代码

<div id="poster">
     
    <h1>
        jquery插件库
    </h1>

    <p>
        Coming 2011
    </p>
 
</div>	


3、有关的css样式也很重要,请参照网盘下载包中的源码,简洁易懂。

相关插件-图像

可视化的交互图形库Cytoscape.js

Cytoscape.js ? 用于数据分析和可视化的交互图形库
  图像
 53094  342

html5前端图片压缩

html5前端图片压缩
  图像
 84169  454

jquery.photoClip图片裁剪添加旋转 缩放按钮功能

项目上用的jquery.photoClip 插件,为了更好的用户体验 需要添加 旋转 缩放按钮功能,所以在原有的基础上添加了点功能,希望能帮助各位,写的不好 海涵!
  图像
 27815  319

二维码生成插件qrcode.js

二维码生成插件qrcode.js,在此插件基础上添加了logo图片功能和对中文的支持,无需对中文转码可直接支持生成中文网址二维码
  图像
 27993  374

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

    Fuyan 0
    2021/5/28 18:11:59
    冷焰火 0
    2019/5/29 15:01:15
    IE不支持,要它何用,background-clip: text; 回复
    GOODBOY 0
    2017/2/26 10:09:40
    hello_wld 0
    2016/1/18 16:01:21

    我去,这个很酷炫啊。怎么没有人评论

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复