Skip to content
/ boomJS Public
forked from chokcoco/boomJS

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

Notifications You must be signed in to change notification settings

shinehs/boomJS

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

33 Commits
 
 
 
 
 
 
 
 

Repository files navigation

boomJS

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

使用方法

// 引入css文件
// <link rel="stylesheet" type="text/css" href="./css/Boom.css" />

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

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

效果图

Boom效果演示图

Boom效果演示图

IOS 下的效果

UIViewXXYBoom

之前在 IOS 上面看到了一个这样的效果,寻思着能否用 Javascript 实现一遍,捣鼓了一番做出了如上图所示效果,因为是非 canvas ,无法取到图片上的色值,使用了背景图定位代替,所以性能方面可能有所不足。

License

MIT

About

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

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 88.3%
  • HTML 6.0%
  • CSS 5.7%