玻璃主题的文章列表，还有玻璃的技术要点_第1页

css毛玻璃效果

毛玻璃其实就是磨砂玻璃，能够模糊的看清背后的风景，让人感觉有种朦胧美，让界面看上去有些层次感。比如：高大上啊，接下来肯定是眼馋手痒的过程。。。当然，用ps搞一个全景毛玻璃背景毫无疑问是最省事的，那接下来就没啥事可干了。当然nonono了。毛玻璃无疑就是种模糊了，少不了filterblur。最终效果（chrome）：天气...

代码星球 ·2021-02-25

一款基于javascript的3D玻璃破碎特效

之前为大家介绍了一款 html5canvas实现图片玻璃碎片特效。今天要给大家带来一款基于javascript的3D玻璃破碎特效。效果图如下：在线预览源码下载html代码：<divid="container"><divid="fragment">&l...

代码星球 ·2021-01-21

html5 canvas实现图片玻璃碎片特效

今天要为大家带来一款html5canvas实现的图片玻璃碎片特效。图片以玻璃碎片的形式出现到界面中，然后似玻璃被打碎的效果渐消息。效果图如下：在线预览源码下载实现代码：html代码：<imgsrc="city_copy.jpg"id="src_img"c...

代码星球 ·2021-01-21

CSS遮罩效果和毛玻璃效果

　　本文将详细介绍CSS遮罩效果和毛玻璃效果普通遮罩　　一般地，处理全屏遮罩的方法是使用额外标签<style>.overlay{position:fixed;top:0;right:0;left:0;bottom:0;background:rgba(0,0,0,0.8);}.lightbox{p...

代码星球 ·2020-05-24

玻璃效果

封装好的帮助类，实现玻璃效果。usingSystem;usingSystem.Collections.Generic;usingSystem.Linq;usingSystem.Runtime.InteropServices;usingSystem.Text;usingSystem.Windows;usingSystem...

代码星球 ·2020-05-17

原来你是这样的毛玻璃

以前写毛玻璃用的都是图层覆盖-->传送门，看了LEAVEROU的《CSS揭秘》后才发现还有更优雅的毛玻璃：<!DOCTYPEhtml><html><head><title>原来你是这样的毛玻璃</title><metacharset="utf-8"...

代码星球 ·2020-04-10

解决css3毛玻璃效果(blur)有白边问题

做一个登录页，全屏背景图毛玻璃效果，实现方法如下：HTML：<body>　　<divclass="login-wrap">　　　　<divclass="login-mask"></div>　　　　<divclass="login-box"></div&g...

代码星球 ·2020-04-10

CSS3中毛玻璃效果的使用方法

今天在使用icloud的时候看到苹果icloud官网的毛玻璃效果非常赞，仔细研究了一下它的实现方式，是使用js配合background-image:-webkit-canvas的形式绘制出的毛玻璃背景图片。不过今天又仔细研究了一下css3中的blur方法，可以实现同样的效果。且配合JS可以实现模糊缩放的效果CSS代码....

开发笔记 ·2020-03-20