现在大部分网页的按钮都是经过美化的,那些原始的浏览器按钮太过于枯燥乏味,让用户失去和网站交互的兴趣。早期我们都是通过背景图片来美化网页按钮,而现在我们可以利用扩展性更好的CSS3来制作漂亮的网页按钮,本文是jQuery/CSS3按钮系列插件的第一篇,希望大家会喜欢。

超可爱的CSS3 3D按钮

这款CSS3按钮相当具有创意,它的外观很独特,非常适合个性化的个人博客上,可以用来制作评论提交按钮或者简单的交互行为按钮,个人非常喜欢它。

DEMO演示        源码下载

纯CSS3实现分享按钮

这些CSS3分享按钮涵盖了国外大部分的社交网站分享按钮,你可以选择其中几个应用到自己的英文网站上去。

DEMO演示        源码下载

CSS3灰色3D按钮组合

这款按钮组合可以有大尺寸和小尺寸按钮,鼠标滑过按钮时就会改变按钮的背景色,让其有发光的立体效果。

DEMO演示        源码下载

纯CSS3实现Metro风格的图标按钮

这款CSS3图标是Metro风格的,外观非常清新漂亮。同时,当鼠标滑过图标是,还会在图标上方滑过文字描述,带飞入飞出的动画特效。

DEMO演示        源码下载

CSS3自定义Radiobox按钮样式

DEMO演示        源码下载

HTML5/CSS3社会化分享按钮

这款分享按钮外观样式非常漂亮,按钮的色彩也比较华丽自然,这款基于HTML5的分享按钮提供两种样式,一种是图标式按钮,另一种则是图标结合文字的按钮样式。

DEMO演示        源码下载

上面的这些CSS3按钮都还不错,欢迎关注jQuery/CSS3经典按钮系列插件的第二篇。

jQuery超炫酷按钮插件及源码的更多相关文章

  1. 8个超炫酷仿HTML5动画源码

    1.jQuery万年历插件 带农历老皇历功能 这是一款基于jQuery的日历插件,这款日历插件和之前分享的日历控件有很大差异,它是一本万年历,包含了农历已经老皇历的功能,是一个挑好日子的工具.同时日历 ...

  2. 程序猿必备的10款超炫酷HTML5 Canvas插件

    1.超炫酷HTML5 Canvas 3D旋转地球动画 这是一款基于HTML5 Canvas的3D地球模拟动画,动画以太空作为背景,地球在太空中旋转,同时我们也可以拖拽鼠标来从不同的角度观察地球.另外我 ...

  3. 8个超炫酷的纯CSS3动画及源码分享

    在现代网页中,我们已经越来越习惯使用大量的CSS3元素,而现在的浏览器也基本都支持CSS3,所以很多时候我们不妨思考一下是否可以用纯CSS3制作一些有趣或者实用的网页.本文要分享8个超炫酷的纯CSS3 ...

  4. 14款让前端开发者心动的jQuery/CSS3插件及源码

    14款让前端开发者心动的jQuery/CSS3插件及源码,一起来看看. 1.jQuery左右滚动banner代码! DEMO演示    /    源码下载 2.jQuery QQ表情插件qqFace ...

  5. 一款基jquery超炫的动画导航菜单

    今天给大家分享一款基jquery超炫的动画导航菜单.这款导航菜单,初始时页面中间一个按钮,单击按钮,菜单从左侧飞入页中.再次单击按钮,导航飞入左侧消息.动画效果很非常炫.一起看下效果图: 在线预览   ...

  6. 一款基于jquery超炫的图片切换特效

    今天为给大家介绍一款基于jquery超炫的图片切换特效.由百叶窗飞入显示图片.图片消息的时候也是百叶窗渐行渐远.用于图片展示,效果还是非常好,我们一起看下效果图: 在线预览   源码下载 来看下实现的 ...

  7. 一款基于jquery超炫的弹出层提示消息

    今天给大家带来一款基于jquery超炫的弹出层提示消息.这款实例页面初始时,一个go按钮.当单击go按钮时,提示强出层以动画形式出现.效果图如下: 在线预览   源码下载 实现的代码. html代码: ...

  8. 轮播插件unsilder 源码解析(一)---使用

    啰嗦几句:学习的可以直接省略,一直本着写原生的插件想法,但是前天看了吕大豹的博客觉得自己都没有正经的写个jquery插件:所以在开始写之前我会先对几个比较热门的jquery的插件进行源码分析:至于为什 ...

  9. 分享一个完美的新闻客户端(酷商城)Android源码

    分享一个完美的新闻客户端(酷商城)Android源码,这个源码项目是从安卓教程网转载过来的,项目主要是解析html,fragment,异步缓存图片加载,webview加载网页等.可以正常的运行的,我已 ...

随机推荐

  1. Xamarin.Android之动画

    Translate动画 这个动画是最常使用到的,主要就是将控件从一个位置移动到另一个位置,并且还可以在这其中增加一定的效果,下面我们将采用两种方式实现动画,首选的是利用XML来制作动画,其次就是利用代 ...

  2. 使用Immutable优化复制

    Orleans有一个降低请求消息序列化开销的功能,这里将首先介绍序列化的工作方式,并解释如何使用这个降低开销的功能 Orleans中的Serialization 当在Orleans中发起一个对grai ...

  3. Asp.Net Web API 2第十七课——Creating an OData Endpoint in ASP.NET Web API 2(OData终结点)

    前言 很久没更新博客了,加上刚过年,现在准备重新开战,继续自己的学习之路.本文已同步到Web API2系列文章中http://www.cnblogs.com/aehyok/p/3446289.html ...

  4. 自己动手写客户端UI库——创建第一个控件

    在上一篇文章中我们主要讲了C#如何和JS通信, 这一篇文章中,我们将创建一个最基础的Button控件 WUI库中控件的继承机制   我们先解释最简单的继承机制,以后WUI库的继承机制会比这个复杂的多 ...

  5. paip.java c# .net php python调用c++ c dll so windows api 总结

    paip.java c# .net  php python调用c++ c dll so windows api 总结 作者Attilax  艾龙,  EMAIL:1466519819@qq.com 来 ...

  6. 用inno Setup做应用程序安装包的示例脚本(.iss文件)(

    用innoSetup做应用程序安装包的示例脚本(.iss文件),具体要看innoSetup附带的文档,好象是pascal语言写的脚本. 示例1(应用程序.exe,客户端安装): ;{089D6802- ...

  7. 在线测试 ssl 安全性

    记录下, https://www.ssllabs.com/index.html

  8. Android——BitMap(位图)相关知识总结贴

    Android中文API(136) —— Bitmap http://www.apkbus.com/android-54644-1-1.html Android 4.0 r1 API—Bitmap(S ...

  9. hibernate spring annotation setup

    First step setup for the pom.xml with hibernate dependency , hibernate dependency need to before the ...

  10. Windows下Nginx的安装与配置(转)

    一.首先去官网下载 nginx1.0.11的Windows版本,官网下载:http://nginx.org/download/nginx-1.0.11.zip 下载到软件包后,解压 nginx-ngi ...