一级分类

创客主机
threejs 3D 爆炸碎片轮播图特效

threejs 3D 爆炸碎片轮播图特效

这是一款基于threejs的3D爆炸碎片轮播图特效,该特效使用threejs来制作轮播图在切换时的爆炸特效,图片爆炸成碎片,然后组合为下一张新的图片,效果非常炫酷。 使用方法 在页面中引入下面的文件。 HTML结构 Codepen网…
Canvas 擦抹模糊玻璃特效

Canvas 擦抹模糊玻璃特效

这是一款HTML5 canvas擦抹模糊玻璃特效。该特效类似橡皮擦特效,当鼠标在屏幕上涂抹时,原本模糊的地方会变成清晰的图片。 使用方法 在页面中引入下面的文件。 HTML结构 JavaScript // defining vari…
6种放大模式图片放大镜jQuery插件

6种放大模式图片放大镜jQuery插件

这是一款支持6种放大模式的jQuery图片放大镜插件。该图片放大镜支持ie8,内置6种炫酷的图片放大效果,可以满足各种网站的图片放大效果需求。 使用方法 在页面中引入下面的文件。 HTML结构 可以通过data-large属性来设置…
CSS3图片鼠标悬停动画特效

CSS3图片鼠标悬停动画特效

这是一款CSS3图片鼠标悬停动画特效。该特效在鼠标悬停到图片上面的时候,利用CSS3制作上下关门的动画效果,非常炫酷。 HTML结构 基本的HTML结构如下 Williamson web developer Kristina web…
超炫CSS3六边形菜单动画特效

超炫CSS3六边形菜单动画特效

这是一款使用CSS3和少量js代码制作的炫酷六边形菜单动画特效。该六边形菜单在鼠标滑过时带有高光动画效果,当点击菜单后,各个菜单项沿六边形的各条边向外弹出,组成一个大的六边形。 HTML结构 该六边形菜单使用一个<svg>…
鼠标滑过图片遮罩层动画CSS3特效

鼠标滑过图片遮罩层动画CSS3特效

这是一款使用CSS3制作的炫酷鼠标滑过图片遮罩层动画特效。该特效中有2种不同的效果,均是咋is本滑过图片时,使用遮罩层的旋转和缩放来展示图片的描述信息。 HTML结构 该特效使用bootstrap来进行布局,核心代码为使用一个div…
HTML5 SVG超链接上显示描述图片特效

HTML5 SVG超链接上显示描述图片特效

这是一款HTML5 SVG超链接上显示描述图片特效。该特效的创意是在鼠标悬停到超链接上面的时候,在超链接上显示一副描述图片。该特效使用了SVG过滤器,同时使用了一些新的CSS特性,请确保使用最新的浏览器来查看这个DEMO。下面是该特…
18种垂直分页导航按钮动画特效

18种垂直分页导航按钮动画特效

这是一组效果非常炫酷的垂直分页导航按钮动画特效。这组特效通用18种效果,可以用于制作幻灯片、页面切换和其它容器组件切换的分页导航按钮。 HTML结构 生成上面的垂直分页导航效果的HTML结构如下: CSS样式 .nav { posi…
纯CSS3百叶窗式切换轮播图特效

纯CSS3百叶窗式切换轮播图特效

这是一款使用纯CSS3制作的百叶窗式切换轮播图特效。该特效使用背景图片来制作,在轮播图切换时,通过一组div元素来制作百叶窗效果,非常的炫酷。 HTML结构 该轮播图特效中使用了6张背景图片,HTML结构如下: duzy fiat …
纯CSS3超酷文章卡片UI设计效果

纯CSS3超酷文章卡片UI设计效果

这是一款使用纯CSS3制作的超酷文章卡片UI设计效果。该文章卡片带有阴影效果,当鼠标滑过卡片时,文章的描述信息会以滑动动画的方式显示在卡片中。 HTML结构 一张卡片的HTML结构如下: 文章标题 文章子标题 文章的描述信息 CSS…
纯CSS3制作逼真的汽车运动动画

纯CSS3制作逼真的汽车运动动画

这是一款使用纯CSS3制作的逼真汽车运动动画特效。该特效中,所有元素都是通过CSS渲染得到的,没有使用任何图片。它通过公路斑马线的左右晃动来制作出汽车运动的视觉效果。 HTML结构 整个汽车运动动画的HTML结构如下: CSS样式 …
嘿,欢迎咨询!