<HTML>

<HEAD>

<!--  meta 解释 :  http://www.haorooms.com/post/html_meta_ds -->

<meta http-equiv="content-Type"content="text/html;charset=utf-8">

<TITLE>js鼠标移入移出效果</TITLE>

<style>

    *{ margin:2;padding:0;}

    .top{background:#5DF5FD; height:20px; position:fixed; z-index:8000;width:100%}

    .width99{width:99%;padding:0;}

    input{

        background-color: yellow;

        border-style: solid;

        border-color: red

    }

</style>

<script type="text/javascript"    src="D:/Old PC/D/html/jQuery/jquery-3.1.0.js" ></script>

<script type="text/javascript">

$(function(){

    var vvv = "eee";

    $("#mybutton").mouseover(function(){

        $("#mydiv").text(vvv);

    })

    $("#mybutton").mouseout(function(){

        $("#mydiv").text("");

    })

})

</script>

</HEAD>

<BODY>

    <button id ="mybutton" >aaaaaaaaaaaa</button>

    <div id="mydiv"></div>

    <input type="image" id="imgbtn" src="http://picm.photophoto.cn/015/037/003/0370031902.jpg" onmouseover="this.src='http://picm.photophoto.cn/015/037/003/0370030833.jpg'" onmouseout="this.src='http://picm.photophoto.cn/015/037/003/0370031902.jpg'" onmousedown="this.src='http://picm.photophoto.cn/015/037/003/0370030688.jpg'" />

</BODY>

</HTML>

js鼠标移入移出效果【原】的更多相关文章

  1. js鼠标移入移出事件会被子元素触发解决方法

    问题:js写了一个鼠标移入移出事件,但是发现会被内部子元素不断的触发 解决方法:建立一个空的div定位到需要触发的位置,然后设置大小和触发范围一样,最后将事件写在空的div上.

  2. CSS3的过渡效果，使用transition实现鼠标移入/移出效果

    在css中使用伪类虽然实现了样式的改变,但由于没有过渡效果会显得很生硬.以前如果要实现过渡,就需要借助第三方的js框架来实现.现在只需要使用CSS3的过渡(transition)功能,就可以从一组样式 ...

  3. antd card 组件实现鼠标移入移出效果

    鼠标移出: 鼠标移入: import React, { Component } from 'react' import { Card, Icon, Avatar } from 'antd'; cons ...

  4. # li鼠标移入移出，点击，变背景色，变checkbox选中状态

    移入移出背景色改变和点击背景色改变,两者是否相互覆盖? 若移出背景色恢复,影响点击事件的背景色改变,会产生效果为: 点击时,背景色改变,并且checkbox选中 鼠标移开后,checkbox仍选中,但 ...

  5. JS鼠标提示框效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. JS鼠标移入，移出事件

    该事件的效果就像百度首页的设置选项,当鼠标移入,移出时的效果,废话不多说了,直接上码. <!DOCTYPE html><html lang="en">< ...

  7. js(jquery)鼠标移入移出事件时，出现闪烁、隐藏显示隐藏显示不停切换的情况

    <script> $(".guanzhu").hover(function(){ $(".weixinTop").show(); },functio ...

  8. div展现与收起效果（鼠标移入移出）

    效果图: 移入: 移出: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  9. jquery事件一 ---鼠标移入移出

    比较一下几个jquery事件的区别 mouseover() 鼠标进入(进入子元素也触发) mouseout() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) m ...

随机推荐

  1. Linux: HowTo See Directory Tree Structure

    https://www.cyberciti.biz/faq/linux-show-directory-structure-command-line/ Linux: HowTo See Director ...

  2. Selenium的自我总结1

    搞了一段时间的Selenium Web的自动化,针对项目要搭建了一套适合项目的测试框架(Selenium[POM/DataDriver]+TestNG+Ant+Jenkins).在最开始看Seleni ...

  3. 简单的数据库备份语句--Oracle+SQLSERVER

    1. 工作中经常需要备份数据库表, 有时候经常需要baidu或者是询问,简单些一下.. 如果备份表不存在时: Oracle的语法 create table zhaobsh as select * fr ...

  4. MiniDP与HDMI的关系

    高清输出革命先行者:HDMI接口 HDMI高清晰度多媒体接口(英文:High Definition Multimedia Interface,HDMI)是一种数字化视频/音频接口技术,是适合影像传输的 ...

  5. Linux基础学习（8）--权限管理

    第八章——权限管理 一.ACL权限 1.ACL权限简介与开启: (1)ACL权限简介: (2)查看分区ACL权限是否开启: (3)临时开启分区ACL权限: (4)永久开启分区ACL权限: 2.查看与设 ...

  6. ZJOI2019 Day1游记

    退役吧垃圾 考的再烂还是要把自己捡起来 如果不想让自己的OI生涯就到这里止步的话 就给我滚去拿剩下的300分吧 浙江省前十六,学校前五,day1比别人差一百多分.如果这样还能进省队的话,我就成为传说了 ...

  7. mysql5.7 rpm安装教程

    注意版本和此次更新时间 2017-12-03  版本:mysql-5.7.20-1.el6.x86_64  环境:linux6.x ​官方下载地址: wget https://dev.mysql.co ...

  8. BZOJ4832[Lydsy1704月赛]抵制克苏恩——期望DP

    题目描述 小Q同学现在沉迷炉石传说不能自拔.他发现一张名为克苏恩的牌很不公平.如果你不玩炉石传说,不必担心,小Q 同学会告诉你所有相关的细节.炉石传说是这样的一个游戏,每个玩家拥有一个 30 点血量的 ...

  9. AC自动机-HDU2896-模板题

    http://acm.hdu.edu.cn/showproblem.php?pid=2896 另一道AC自动机的模板题,不过这题需要记录一下具体的匹配情况. /*------------------- ...

  10. CentOS 显示历史执行过的命令以及用户历史命令缓存文件

    1.history命令用于显示历史执行过的命令 执行 history命令能显示出当前用户在本地计算机中执行过的最近 1000 条命令记录. 如果觉得 1000 不够用,还可以自定义/etc/profi ...