文件名称:blur_desktop:纯HTML实现类似mac os动态高斯模糊效果
文件大小:1.35MB
文件格式:ZIP
更新时间:2024-03-12 22:22:50
macos blur stackblur blurview html2canvas
blur_desktop 纯html实现类似mac os动态高斯模糊效果 先看下效果: 在线演示: : 整个页面分为: 顶部工具栏(实现了高斯模糊) 桌面区 开始菜单(实现了高斯模糊) 通知区(实现了高斯模糊) 底部码头(实现了高斯模糊) 桌面展示 开始菜单和通知区展示 其实原理就是把桌面截了个屏然后再做高斯模糊,覆盖在原来的桌面上截取部分作展示,也就其实是两层图片 用到的js库如下 一个纯前端js工具用来将页面截取成一个图片 使用画布技术做高斯模糊的js工具,挺好用 当然,做的这个东西是建立在对性能,对浏览器兼容性等等都不考录的情况下的一个尝试,目前在chrome下测试效果完全没有问题,在IE下好像不太理想,HTML5性能不好 友情链接,我的简书
【文件预览】:
blur_desktop-master
----_config.yml(26B)
----css()
--------index.css(6KB)
----README.md(2KB)
----LICENSE(1KB)
----images()
--------Trash Empty.png(88KB)
--------google.png(14KB)
--------ps.png(53KB)
--------photoshop.png(81KB)
--------renren.png(7KB)
--------Safari.png(68KB)
--------skype.png(22KB)
--------document-word.png(59KB)
--------xunlei.png(45KB)
--------chrome.png(94KB)
--------file.png(47KB)
--------document-powerpoint.png(34KB)
--------player.png(36KB)
--------1.jpg(194KB)
--------finder.png(50KB)
--------Folder Smart.png(27KB)
--------Eclipse.png(52KB)
--------document-excel.png(39KB)
--------qq-logo.png(22KB)
----js()
--------jquery.slidereveal.min.js(3KB)
--------stackblur()
--------pintuer()
--------canvasUtil.js(1KB)
--------dom-to-image.min.js(9KB)
--------bluebird()
--------jquerySlider.plugin.js(1KB)
--------html2canvas()
----index.html(16KB)