jQuery打造动态渐变按钮（6）
作者：mankaiviky 来源：蓝色理想 发布时间：2010-05-10 20:21:00
标签：jquery,动态,按钮,渐变
Step4 - CSS修改
在纯CSS效果的示例中，我们是利用:hover伪类来实现sprite图片的切换，当我们使用jQuery后，是引入一个<span>层作为鼠标经过时背景图，所以CSS需要做如下修改：
/*之前的按钮悬停样式*/
.button:hover{
background:url(bg_button.gif) bottom no-repeat;
}
修改为
/*不需要在设置:hover的样式，而是设置span.hover的样式*/
.button span.hover {
/*注意要使用绝对定位*/
position: absolute;
display: block;
width:200px;
height:80px;
background:url(bg_button.gif) bottom no-repeat;
text-indent:-9999px;
}
总结
以上我们按4个步骤实现了一个动态渐变按钮，在演示中，我还提供了一个扩展示例，您可以跟着自己实现一个，也可以下载源代码修改定制，当然，您有什么好的提议或者有什么问题，欢迎给我留言。
本文地址：http://www.cnblogs.com/wiky/articles/gradual-change-button.html
0
投稿猜你喜欢
- 阅读目录• 下载MySQL免安装版• 配置MySQL数据库• MySQL环境变量• 安装MySQL数据库 公司服务器是Window
- 用analyze进行处理，定期进行处理ANALYZE [LOCAL | NO_WRITE_TO_BINLOG] TABLE tb1_name
1. 实例描述在平时编程的过程中，会经常在网上翻译一些单词，本文使用Python制作一款翻译小工具，不仅可以自己用，还可以嵌入到程序当中。运- 近年来流行 Ajax，而 Ajax 的本质就是 XMLHttpRequest，是客户端 XMLHttpRequest 对象的使用。相对于 A
- 一、UDP编程1.客户端Client:发起访问的一方。2.服务器端3.server段编程（1）建立socket，socket是负责具体通信的
- 1. 集合 set 简介集合的最大特征是其每个元素都是唯一的，它可以删除、可以增加、也可以通过增删实现替换元素，但是它是没有下标的，你无法通
- 傅里叶变换dft = cv.dft(np.float32(img),flags = cv.DFT_COMPLEX_OUTPUT)傅里叶逆变换
- 前言先介绍下问题：组内有十来台机器，上面用 cron 分别定时执行着一些脚本和 shell 命令，一开始任务少的时候，大家都记得哪台机器执行
- 我开发了一个程序，数据在服务器端处理，通过ODBC和Access通讯。在实际应用中，调用后台存储过程不方便，花费时间也长。有什么好办法可以在
- 1、服务器就是一系列硬件或软件，为一个或多个客户端（服务的用户）提供所需的“服务”。它存在唯一目的就是等待客户端的请求，并响应它们（提供服务
- np.newaxisnp.newaxis 的功能是增加新的维度，但是要注意 np.newaxis 放的位置不同，产生的矩阵形状也不同。通常按
- 简述Motivationsometimes，换一种获取数据的方式，可以提高数据获取的速度。sometimes，由于预计爬取的数据长度不确定，
- 无限循环如果条件判断语句永远为 true，循环将会无限的执行下去，如下实例：#!/usr/bin/python# -*- coding: U
- 迭代器什么是迭代迭代是重复反馈过程的活动，其目的通常是为了逼近所需目标或结果。每一次对过程的重复称为一次“迭代&
- 本文实例为大家分享了Python+Opencv实现图像匹配功能的具体代码，供大家参考，具体内容如下1、原理简单来说，模板匹配就是拿一个模板（
- 使用说明：需要引入插件calendar.js/calendar.min.js须要引入calendar.css 样式表，可以自定义自己想要的皮
- drop PROCEDURE if exists my_procedure; create PROCEDURE my_procedure()
- torch.optim的灵活使用详解1. 基本用法：要构建一个优化器Optimizer，必须给它一个包含参数的迭代器来优化，然后，我们可以指
- phpMyAdmin可以管理整个MySQL服务器(需要超级用户)，也可以管理单个数据库。为了实现后一种，你将需要合理设置MySQL用户，他只
- numpy官方文档meshgrid函数帮助文档https://docs.scipy.org/doc/numpy/reference/gene
