Skip to content

chokcoco/boomJS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

62 Commits
 
 
 
 
 
 
 
 

Repository files navigation

boomJS

一个有趣的动画效果,用 JavaScript 配合 CSS3 实现让图片爆炸的动画。

Demo演示戳我

Example

Boom效果演示图

Boom效果演示图

Usage

<!-- style -->
<link rel="stylesheet" type="text/css" href="Boom.css" />
<!-- scripts -->
<script src="jquery.js"></script>
<!-- scripts -->
<script src="boom.js"></script>

<script>
// 调用方法:
//法一:传入图片的 jQuery 对象
boom($('img')) 

// 法二:构建 boom 实例,传入图片的 jQuery 对象
var bom = boom();
bom.boom($('img'));
</script>

API

boom($('img'),{
  // 缩放值
 'scaleLevel' : 3,
  // 模糊值
 'blurLevel': 9,
  // 弹射距离 
 'boomLevel': 4,
  // 爆炸时长
 'boomTime':800,
  // 是否打开日志
 'isOpenLog':true
});

温馨提示,不建议将 scaleLevel 的值设太高 :) 。

About

JavaScript实现一个有趣的浏览器图片爆炸动画效果

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published