Sticker.js 是一个很小的 JavaScript 库,它允许您在网页中创建漂亮的贴纸效果。没有依赖关系(不需要 jQuery),可以在大多数支持 CSS3 的主流浏览器工作。下面有简单的使用示例,更多功能等着你去发现。

您可能感兴趣的相关文章

使用示例:

HTML:

<!-- dom elements -->
<div class="sticker example-1"></div>
<div class="sticker example-2"></div>

CSS:

.sticker {
width: 180px;
height: 180px;
} // add image
.example-1 .sticker-img {
background-image: url(heroes-2.png);
} // add color
.example-2 .sticker-img {
background-color: #ff4a85;
} // change shadow opacity
.example-2 .sticker-shadow {
opacity: 0.6;
}

JavaScript:

<!-- call sticker js -->
Sticker.init('.sticker');

  

立即下载      在线演示

本文链接:Sticker.js – 帮助你在网站中加入贴纸效果

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

Sticker.js – 帮助你在网站中加入贴纸效果的更多相关文章

  1. Sticker.js生成图片或者页面元素“速干贴”效果

    ​在线演示 本地下载 真实的效果,真的非常好玩!

  2. RulersGuides.js – 网站中实现 Photoshop 标尺效果

    RulersGuides.js 是一个 JavaScript 库,在网页上添加类似 Photoshop 中的标尺和辅助网格线.要创建创建网格线线,请单击垂直或水平的标尺,然后推动就可以.还可以使用相应 ...

  3. [译]MVC网站教程(四):MVC4网站中集成jqGrid表格插件(系列完结)

    目录 1.   介绍 2.   软件环境 3.   在运行示例代码之前(源代码 + 示例登陆帐号) 4.         jqGrid和AJAX 5.         GridSettings 6.  ...

  4. 通过a标签在页面上显示视频网站中的视频

    1.把视频传到优酷.腾讯等视频网站中 <!DOCTYPE html> <html> <head lang="en"> <meta char ...

  5. 将w3cplus网站中的文章页面提取并导出为pdf文档

    最近在看一些关于CSS3方面的知识,主要是平时看到网页中有很多用CSS3实现的很炫的效果,所以就打算系统的学习一下.在网上找到很多的文章,但都没有一个好的整理性,比较凌乱.昨天看到w3cplus网站中 ...

  6. TogetherJS – 酷!在网站中添加在线实时协作功能

    TogetherJS是一个免费.开源的 JavaScript 库,来自 Mozilla 实验室,可以实现基于 Web 的在线协作功能.把 TogetherJS 添加到您的网站中,您的用户可以在实时的互 ...

  7. 通过JS语句判断WEB网站的访问端是电脑还是手机

    通过JS语句判断WEB网站的访问端是电脑还是手机,以显示不同的页面! 目录腾讯网的适配代码如何判断访问网站的机器类型-如何判断ipadJS 判断浏览器客户端类型(ipad,iphone,android ...

  8. 如何通过图片在 HTTPS 网站中获取 HTTP 接口数据

    <script> (function() { var Decode=function(b){var e;e=[];var a=b.width,c=b.height,d=document.c ...

  9. 【前端】向blog或网站中添加语法高亮显示代码方法总结

    向blog或网站中添加语法高亮显示的代码方法总结 文章目录 预备知识 目标 第一类方法:嵌入 第二类方法:外部引用 第三类方法:忽略HTML和PHP 最近在写代码时遇到一个问题,就是如何让代码像在ID ...

随机推荐

  1. python--基础学习(六)sqlite数据库基本操作

    python系列均基于python3.4环境 1.新建数据表 新建表,命名为student(id, name, score, sex, age),id为关键字,代码如下: import sqlite3 ...

  2. 使用SQL Server作业设置定时任务

    1.开启SQL Server Agent服务 使用作业需要SQL Agent服务的支持,并且需要设置为自动启动,否则你的作业不会被执行. 以下步骤开启服务:开始-->>>运行--&g ...

  3. PHP的学习--PHP的闭包

    php的闭包(Closure)也就是匿名函数,是PHP5.3引入的. 闭包的语法很简单,需要注意的关键字就只有use,use是连接闭包和外界变量. $a = function() use($b) {} ...

  4. Android自定义ImageView圆形头像

    效果图: 代码如下: RoundImageView.java import cn.comnav.evaluationsystem.R; import android.content.Context; ...

  5. Ruby FFI 入门教程

    FFI是一个可以让用户使用Ruby调用C代码的gem.如果你需要执行一些系统底层调用,或者做一些高性能运算的话,FFI是一个很不错的选择. 1. 安装 执行gem install ffi即可.非常标准 ...

  6. ibatis轻松入门

    近日,由于公司项目应用开发的逻辑层使用的是iBatis.上网查了些资料,自己写了点demo入门.感觉良好.iBatis实在是比Hibernate很容易入门,贡献出来与各路菜鸟分享(后文附源码),希望得 ...

  7. Jackson序列化和反序列化Json数据完整示例

    Jackson序列化和反序列化Json数据 Web技术发展的今天,Json和XML已经成为了web数据的事实标准,然而这种格式化的数据手工解析又非常麻烦,软件工程界永远不缺少工具,每当有需求的时候就会 ...

  8. Python 3.0(一) 简介

    Python 3.0(一) 简介 [目录] 1.简介 2.python特点 3.安装 简介: Python是可以称得上即简单又功能强大的少有的语言中的一种.你将会惊喜地发现,专注于问题的解决方案而不是 ...

  9. nagios监控流量脚本

    需求是我们需要对服务器上的流量进行监控,网络上有个流传的check_traffic.sh,它需要被监控机开启snmp.但是感觉都使用上了nagios还要开snmp...有点斧子剪刀一起用的感觉,所以就 ...

  10. Auto Mapper03

      经过上一篇博客的学习,大体了解了Auto Mapper的运行机制和操作流程.我们下来学习下,AutoMapper里面具体的一些东西. 一:规则       当我们使用AutoMapper创建实体和 ...