按钮是网页表单交互的灵魂,一套优秀的按钮设计能不仅提升网站整体的用户体验,更重要的是可以在网站互动方面做出非常重要的贡献。那么我们该如何来设计按钮,什么样的按钮才能让用户有交互的冲动?下面给大家分享几款非常有创意的基于CSS3和jQuery的按钮导航,一起来看看。
1、一组基于jQuery和CSS3的社会化分享按钮
这是一组简单美观的社会化分享按钮,包括twitter、facebook、g+等常用分享,拥有长方形和正方形两种规格选择。
在线演示 /
源码下载
2、灰色超具立体感的CSS3导航按钮
提供了水平和竖直的立体导航按钮,挺酷的。
在线演示 /
源码下载
3、超友爱的CSS3卡通按钮
一组很可爱的卡通按钮,非常有创意。
在线演示 /
源码下载
4、绚丽的CSS3发光按钮
五光十色的发光按钮,让你眼花缭乱,不过从里面拿几个出来看真的很棒。
在线演示 /
源码下载
5、长条形3D CSS3按钮
在线演示/源码下载
6、纯CSS3实现的分享按钮
在线演示 /
源码下载
7、Github风格的按钮
清新大气的Github风格的按钮。
在线演示
看了以上7款非常有创意的按钮设计,你是否有使用它们的冲动呢,欢迎收藏这些按钮。转载请注明出处:html5_dev的专栏
分享到:
相关推荐
这是一款非常有创意的jQuery和CSS3表单提交按钮动画特效。该提交按钮在用户点击的时候会转换为一个进度条,用以表示当前提交的进程,当提交结束后,进度条优惠转换为一个圆形的成功符号,效果非常酷。
css3实现多款创意按钮 css3实现多款创意按钮网页特效.zip
这是一款非常有创意的jQuery和CSS3圆形菜单界面布局设计。这个界面布局中,通过点击主菜单按钮可以在它的四周出现主菜单按钮。点击每一个主菜单按钮都会以动画的方式切换到相应的界面,效果非常的炫酷。
之前我们分享过很多基于CSS3和jQuery的翻转按钮,比如这款纯CSS3带图标的3D旋转立方体链接和别具创意的CSS3鼠标悬停翻转按钮都非常不错。今天要给大家带来另外一款基于CSS3的鼠标滑过翻转按钮,按钮有平面翻转动画,...
CSS3实现的鼠标移动到按钮上的一些小效果,微观的效果,但很有创意,用起来很舒服。 附件提供了7种可任意选择的特效,请在支持CSS3属性浏览器下观看,推荐火狐
jQuery CSS3创意搜索框特效是一款带有动画效果的搜索框展开收缩特效下载。
CSS3实现创意开关切换按钮.zip
CSS3创意按钮鼠标经过翻转特效.zip
这是一款使用jQuery和CSS3制作的创意添加到购物车动画特效。该特效在用户点击“添加到购物车”按钮时,在屏幕右下角显示一个购物车图标及购物数量。当用户点击该购物车图标后,会展示出用户购物的明细。
这是一款效果炫酷的jQuery和css3顶部隐藏菜单3d旋转显示特效插件。该顶部菜单十分有创意,开始时顶部菜单是隐藏的,只有一个导航按钮,点击导航按钮后顶部菜单以3d旋转的方式显示出来。
14款CSS3卡片堆叠切换动画特效是一款非常有创意的堆叠卡片切换动画特效。这些堆叠卡片切换效果通过点击确定或取消按钮,以不同的方式将最上面的卡片切换到底部。
非常实用的特效代码,可以完美运行,可以二次修改!
非常实用好看的特效代码,可以完美运行,可以二次修改!
jQuery+CSS3下拉高级搜索框特效是一款当用户点击了搜索按钮之后,会出现搜索输入框,以及一个带相关搜索链接的面板供用户选择。
对于开关切换按钮,我们在之前的文章中已经分享不少了,比如CSS3创意开关切换按钮就非常不错。今天我们再来分享一款基于SVG和HTML5的开关切换按钮,鼠标点击按钮后即可来回切换按钮的状态,滑动的动画效果非常不错。
这个太有用了。 今天要分享的jQuery插件也是内容切换功能,不过它的特点是切换按钮以水平时间轴的形式,很有创意。
HTML5创意无按钮风格贪食蛇代码.zip
7.4 教程:带有效果的照片集 197 7.4.1 任务概览 197 7.4.2 编程 198 7.5 使用jQuery lightBox的高级照片集 201 7.5.1 基础 202 7.5.2 定制lightBox 204 7.6 教程:lightBox照片集 207 7.7 使用Cycle实现幻灯片动画 ...
欢迎提交分享 :party_popper:iphone X 缺口滚动条2jQuery 问答测试插件19 种漂亮的模态对话框效果页面变形过渡效果全屏滚动 jQuery 插件视差效果幻灯片轮播插件12 种基于 flexbox 的响应式创意定价表效果创意按钮...