首页 > 其他分享 > 示例 鼠标悬停修改图片的内容

示例 鼠标悬停修改图片的内容

时间:2023-02-09 16:36:47浏览次数:58  
标签:scale 1.0 示例 dog 修改 鼠标悬停 querySelector var document


代码


<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>

</head>
<body>

<button id="y">狗1</button>
<button id="b">狗2</button>
<div class="box">
<img id="dog" style="width: 200px;" src="https://t7.baidu.com/it/u=4162611394,4275913936&fm=193&f=GIF" alt="">
</div>
<script>

var b1 = document.querySelector("#y")
var b2 = document.querySelector("#b")

var dog = document.querySelector("#dog")


b1.onmouseenter = function () {
dog.src = "https://t7.baidu.com/it/u=4162611394,4275913936&fm=193&f=GIF"
}
b2.onmouseenter = function () {
dog.src = "https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
}

</script>

</body>
</html>

标签:scale,1.0,示例,dog,修改,鼠标悬停,querySelector,var,document
From: https://blog.51cto.com/u_13137233/6047095

相关文章

  • root 用户修改文件提示无权限 chmod: changing permissions of ‘authorized_keys’:
    使用lsattr命令查看文件的属性,使用chattr命令的修改文件的属性。解决修改文件提示无权限:chattr-i<file>chattr命令的详解参考链接【3】。参考链接:1、......
  • Flutter中修改Android项目的应用名称、应用图标、应用启动画面
    1.修改应用名称在android▸app▸src▸main▸AndroidManifest.xml中修改android:label="你的应用名称"。2.修改应用图标在android▸app▸src▸res▸mip......
  • MySQL 如何实现表的创建、复制、修改与删除
    MySQL中如何利用代码完成表的创建、复制、修改和删除?下面总结了在创建表的时候各字段的含义以及注意哪些问题,复制和修改及删除常用的代码。一、创建表--创建新表,如果存在......
  • 使用 NineData GUI 创建与修改 ClickHouse 表结构
    01前言随着ClickHouse的快速发展,越来越多的开发者关注并在业务中使用ClickHouse。作为开发人员除了在应用中访问数据库、进行业务数据的分析跟进,还有很重要的一个库表......
  • openssh 修改版本号显示
     #背景介绍:G端项目经常收到相关漏洞但有时升级最新版本(8.8p)还是会有相关漏洞(CVE-2020-15778),只能禁用相关命令或修改版本号#漏洞名称OpenSSH命令注入漏洞(CVE-2020-157......
  • QT Dom修改xml
    QFilefile("Init.xml");if(!file.open(QFile::ReadOnly))return;QDomDocumentdoc;if(!doc.setContent(&file)){file.close();re......
  • Linux route命令修改默认路由优先级
    (自测可用)摘自:https://www.cnblogs.com/luoyang712/p/11953256.html在多个网络连接的情况下,比如以太网和WIFI同时存在的时候,路由表中就会存在多个默认网关。我们在......
  • kendo ui的treeView节点点击事件修改和grid的配置的一点总结
    kendo-ui的treeView节点(node)点击时 可以触发一个select的事件(event),并且连续点击多次相同节点,可以触发并且只能触发一次该事件。可是需求上需要实现:每次点击相同的节点,......
  • 欧陆战争6修改
    新人第一次写修改教程,写的不好见谅QWQ靡不有初,鲜克有终。————《诗经·大雅》一、关于准备工作如果您没有安装MT管理器,请移步https://mt2.c......
  • 设置audit捕捉系统时钟修改信息
    配置audit规则auditctl-aalways,exit-Farch=b64-Sadjtimex-Ssettimeofday-ktime-changeauditctl-aalways,exit-Farch=b32-Sadjtimex-Ssettimeofday-S......