css滑动鼠标到img后,切换图片
写了个样例:
<a href="#"><img src="http://csdnimg.cn/pubfooter/images/gongshang_logos.gif" border="0" onMouseOver="this.src='v=07491728.gif" style="color:rgb(0,0,238);font-family:Consolas, 'Lucida Console', monospace;white-space:pre-wrap;">http://www.baidu.com/img/baidu_jgylogo3.gif?v=07491728.gif'" onMouseOut="this.src='http://img.baidu.com/img/logo-zhidao.gif'" /></a>
在动态代码中的写法:
<img src="data:images/red'+i+'s.png" style="width:20px;height:29px;" onMouseOver="this.src=\'images/blue'+i+'s.png\'"; onMouseOut="this.src=\'images/red'+i+'s.png\';">
实现效果
初始状态:
鼠标滑动上:
鼠标移开:
css滑动鼠标到img后,切换图片的更多相关文章
- 【jQuery】鼠标接触按钮后改变图片
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...
- Jquery的动态切换图片
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 鼠标悬停,使用css切换图片
鼠标悬停,使用css切换图片 当鼠标悬停在li上面切换另一张图片,只需添加下述css样式即可
- 原生JS—实现图片循环切换及监测鼠标滚动切换图片
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...
- H5+CSS3实现手指滑动切换图片
包含3个文件:html.slider-H5.js.jquery.js(自行下载).在html中可配置滑动参数.具体代码如下: HTML代码: <!DOCTYPE HTML> <htm ...
- CSS鼠标点击式变化图片透明度
今天分享前端代码主题:jequery控制css图片透明度 很多时候在网站图片处理上需要实现一些辅助效果,比如鼠标在图片上滑动时或点击时改变图片颜色(变灰或者其他),其实一个简单的办法就是改变图片css ...
- 代码: CSS3动画,简单示例(鼠标移上去后,背景图片旋转)
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.mi ...
- 基于jQuery左右滑动切换图片代码
分享一款基于jQuery左右滑动切换图片代码.这是一款基于jQuery实现的左右滑动切换焦点图代码.效果图如下: 在线预览 源码下载 实现的代码: <div class="v_ou ...
- jQuery实现的鼠标滑过切换图片代码实例
jQuery实现的鼠标滑过切换图片代码实例:有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍 ...
随机推荐
- 11/1 NOIP 模拟赛
11.1 NOIP 模拟赛 期望得分:50:实际得分:50: 思路:暴力枚举 + 快速幂 #include <algorithm> #include <cstring> #in ...
- 【Uva 1601】The Morning after Halloween
[Link]: [Description] 给你一张平面图; 最多可能有3只鬼; 给出这几只鬼的初始位置; 然后,这几只鬼有各自的终点; 每秒钟,这几只鬼能同时移动到相邻的4个格子中的一个 任意两只鬼 ...
- 常用Linux命令 mount df dd
mount -t tmpfs tmpfs ~/build -o size=1G -t 对应的是类型 -o 对应的是选项 tmpfs是Linux/Unix系统上的一种基于内存的文件系统.tmpfs可以使 ...
- UVA 12508 - Triangles in the Grid(计数问题)
12508 - Triangles in the Grid 题目链接 题意:给定一个n∗m格子的矩阵,然后给定A,B.问能找到几个面积在A到B之间的三角形. 思路:枚举每一个子矩阵,然后求[0,A]的 ...
- UNIX多线程编程
一个程序至少有一个进程.一个进程至少有一个线程.进程拥有自己独立的存储空间,而线程能够看作是轻量级的进程,共享进程内的全部资源.能够把进程看作一个工厂.线程看作工厂内的各个车间,每一个车间共享整个工厂 ...
- ip6tables: ipv6-icmp vs icmp
ip6tables: ipv6-icmp vs icmp资料来源 https://www.jethrocarr.com/2013/02/09/ip6tables-ipv6-icmp-vs-icmp/I ...
- Python: PS 图像调整--对比度调整
本文用 Python 实现 PS 里的图像调整–对比度调整.具体的算法原理如下: (1).nRGB = RGB + (RGB - Threshold) * Contrast / 255 公式中,nRG ...
- java为什么要定义接口等相关解释
1.接口的作用是实现多重继承 因为只能继承一个类(规定的) 2.一个类只能继承一个父类,但是可以实现一个或多个接口 3.abstract关键词能让你在类里创建一个或多个没有定义的方法—你给出接口,但 ...
- ZJOI2005沼泽鳄鱼
矩阵优化dp ** 注意:矩阵乘法没有交换律 ** 思路:类比P2151hh去散步 代码特点在一维的答案矩阵 1.矩阵优化两点间方案数不必赘述 2.注意2,3,4可以办到以他们的lcm为周期,正是因为 ...
- POJ--2516--Minimum Cost【最小费用最大流】
链接:http://poj.org/problem?id=2516 题意:有k种货物,n个客户对每种货物有一定需求量,有m个仓库.每一个仓库里有一定数量的k种货物.然后k个n*m的矩阵,告诉从各个仓库 ...