JS之鼠标改变img
代码用途：
通过点击图片，来改变图片内容
代码：
<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('im')
if (element.src.match("2"))
{
element.src="./1.jpg";
}
else
{
element.src="./2.jpg";
}
}
</script> <img id="im" onclick="changeImage()" src="./2.jpg"> <p>君莫笑是冠军~~</p> </body>
</html>
效果图：
1.开始的时候，图片是个这样子的~
2.点击图片后，图片变成这样的啦~
JS之鼠标改变img的更多相关文章
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
- Magnifier.js - 支持鼠标滚轮缩放的图片放大镜效果
Magnifier.js 是一个 JavaScript 库,能够帮助你在图像上实现放大镜效果,支持使用鼠标滚轮放大/缩小功能.放大的图像可以显示在镜头本身或它的外部容器中.Magnifier.js 使 ...
- js获取select改变事件
js获取select改变事件onchage前的值 和 onclick事件 <select id="wupin_id" name="wupin_id" on ...
- js实现鼠标的滑动
js实现鼠标的滑动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- js获得鼠标的位置
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js中鼠标滚轮事件详解
js中鼠标滚轮事件详解 (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...
- JS判断鼠标向上滚动还是向下滚动
js如何判断滚轮的上下滚动,我们应该都见到过这种效果,用鼠标滚轮实现某个表单内的数字向上滚动就增加,向下滚动就减少的操作,这种效果是通过js对鼠标滚轮的事件监听来实现的.今天简单的研究了一下如何使用j ...
- JS 判断鼠标滚轮的上下滚动
JS 判断鼠标滚轮的上下滚动 <script type="text/javascript"> var scrollFunc = function (e) { e = ...
- JS Event 鼠标拖拽事件
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> ...
随机推荐
- java设计模式之生产者/消费者模式
什么是生产者/消费者模式? 某个模块负责产生数据,这些数据由另一个模块来负责处理(此处的模块是广义的,可以是类.函数.线程.进程等).产生数据的模块,就形象地称为生产者:而处理数据的模块,就称为消费者 ...
- PY3 多组输入
在c语言你能使用while(scanf(“%d”,x) !=EOF)判断输入是否碰到文件结束符(EOF). 但是在python你不能使用while((x=input())!=EOF). 这有两种方法可 ...
- 使用vue-router设置每个页面的title
进入 router 文件夹底下的index.js文件 首先引入: import Vue from 'vue' import Router from 'vue-router' 然后在路由里面配置每个路由 ...
- webpack打包vue文件报错，但是cnpm run dev正常，最后我只想说：是我太笨，还是webpack4.4版本太坑
最近做一个项目,需要使用webpack打包 .vue 文件的单页面应用,调试都正常,使用cnpm run dev 都可以,就是webpack打包时报错.如下: ERROR in ./src/App.v ...
- HomeBrew的安装和简单使用
homebrew 官网 https://brew.sh/ 转自:http://blog.csdn.NET/maojudong/article/details/7918291 1. 前言 作为Linu ...
- Hadoop 2.7.3 完全分布式维护-简单测试篇
1. 测试MapReduce Job 1.1 上传文件到hdfs文件系统 $ jps Jps SecondaryNameNode JobHistoryServer NameNode ResourceM ...
- Hive QL的操作
一.数据定义DDL操作 创建表: --create table为创建一个指定名字的表 create(external) table table_name --external关键字可以让用户创建一个外 ...
- ajax请求成功前，加载中loading显示
/*第一次刷新--非定时器刷新数据*/ var fistInitColumn = true; var getAllColumnDatas = function(){ var params = {}; ...
- mysql索引简单分析
索引对查询的速度有着至关重要的影响,理解索引也是进行数据库性能调优的起点.考虑如下情况,假设数据库中一个表有10^6条记录,DBMS的页面大小为4K,并存储100条记录.如果没有索引,查询将对整个表进 ...
- 使用python将excel数据导入数据库
使用python将excel数据导入数据库 因为需要对数据处理,将excel数据导入到数据库,记录一下过程. 使用到的库:xlrd 和 pymysql (如果需要写到excel可以使用xlwt) 直接 ...