鼠标事件界面转换 mouseover() 方法

mouseover() 方法

<html>

<head>

<script type="text/javascript" src="/jquery/jquery.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$("p").mouseover(function(){

$("p").css("background-color","yellow");

});

$("p").mouseout(function(){

$("p").css("background-color","#E9E9E4");

});

});

</script>

</head>

<body>

<p style="background-color:#E9E9E4">请把鼠标指针移动到这个段落上。</p>

</body>

</html>

jQuery 效果 - 隐藏和显示

<!DOCTYPE html>

<html>

<head>

<script src="/jquery/jquery-1.11.1.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$("#hide").click(function(){

$("p").hide();

});

$("#show").click(function(){

$("p").show();

});

});

</script>

</head>

<body>

<p id="p1">如果点击“隐藏”按钮,我就会消失。</p>

<button id="hide" type="button">隐藏</button>

<button id="show" type="button">显示</button>

</body>

</html>

两个结合之后的代码

$(function() {

$("#tzgg1").addClass(‘title_h2‘);//设置其中一个初始时的效果

});

$(document).ready(function() {

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

$("#tzgg1").addClass(‘title_h2‘);

$("#gzdt1").removeClass(‘title_h2‘);

$("#tzgg2").show();

$("#gzdt2").hide();

$("#tzgg3").show();

$("#gzdt3").hide();

});

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

$("#gzdt1").addClass(‘title_h2‘);

$("#tzgg1").removeClass(‘title_h2‘);

$("#gzdt2").show();

$("#tzgg2").hide();

$("#gzdt3").show();

$("#tzgg3").hide();

});

});

时间: 2024-10-29 00:28:24

鼠标事件界面转换 mouseover() 方法的相关文章

div拖拽到iframe上方 导致 缩放和拖拽的不平滑和鼠标事件未放开 解决方法

思路一:用在开始进行缩放(触发了resizable的start事件)为iframe添加z-index属性,将iframe放置在最下层. $("#draggable").resizable({ helper: "widget_resizable_helper", start: function( event, ui ) { $("#draggable").css({position:"relative","z-inde

鼠标事件监听器的创建和使用

鼠标操作是图形操作系统最常用操作,用户使用鼠标单击,双击,右击,拖动等操作实现与软件的交互. 鼠标事件监听器 鼠标事件监听器由MouseListener接口和MouseMotionListener接口定义,分别定义鼠标捕获不同的鼠标操作方法. MouseListener监听器方法说明 mouseClicked(MouseEvent e) 处理鼠标单击事件方法 mouseEntered(MouseEvent e) 鼠标进入组件区域时执行方法 mouseExited(MouseEvent e) 鼠标

JQuery事件——鼠标事件1

鼠标事件.mousemove()..mouseover()..mouseout()..mouseenter() 和.mouseleave() 1   .mousemove()监听用户移动的操作 2   $ele.mousemove()绑定$ele元素,不带任何参数,用来指定触发一个事件 3   $ele.mousemove(handler(eventObject))绑定$ele元素,每次$ele元素触发点击操作会执行回调handler函数,可以针对事件的反馈进行很多操作 4   $ele.mou

jQuery事件 mouseover方法与mouseout方法实现鼠标移进显示移出消失的效果 (css控制span标签)

<script> $(function(){ var text ; $(".pos span").each(function(){ text = $(this).text().trim(); if(text=="设为默认"){ $(this).css('display','none'); } }); $(".pos").mouseover(function(){ //鼠标移进显示效果 text = $(this).find('span

JavaScript学习笔记3之 数组 &amp; arguments(参数对象)&amp; 数字和字符串转换 &amp; innerText/innerHTML &amp; 鼠标事件

一.Array数组 1.数组初始化(Array属于对象类型) 1 /*关于数组的初始化*/ 2 //1.创建 Array 对象--方法1: 3 var arr1=[]; 4 arr1[0]='aa';//给数组元素赋值 5 arr1[1]='bb'; 6 arr1[2]='cc'; 7 arr1[3]='dd'; 8 console.log(arr1);//["aa","bb","cc","dd"] 9 //1.创建 Arra

鼠标事件之鼠标滑过事件MOUSEOVER

来源地址:http://www.g2room.com/jquery/index.php?p=example%2Fevent%2Fmouseover.html&n=%E9%BC%A0%E6%A0%87%E4%BA%8B%E4%BB%B6%E4%B9%8B%E9%BC%A0%E6%A0%87%E6%BB%91%E8%BF%87%E4%BA%8B%E4%BB%B6MOUSEOVER var i = 0; // 定义当事件触发后执行的方法 function showContent (event){ $(

C语言控制台窗口图形界面编程(八):鼠标事件

<知识分享> 上次讲的是键盘事件,这次我们介绍鼠标事件.下面先介绍下鼠标事件的结构体以及相关信息. typedef struct _MOUSE_EVENT_RECORD      //鼠标事件结构体 { COORD dwMousePosition;      //当前鼠标在控制台窗口缓冲区的位置 DWORD dwButtonState;        //鼠标按键的状态 DWORD dwControlKeyState;    //控制键状态 DWORD dwEventFlags;       

Java Swing界面编程(25)---事件处理:鼠标事件及监听处理

如果想对一个鼠标的操作进行监听,如果鼠标按下.松开等,则可以使用MouseListener接口. package com.beyole.util; import java.awt.event.MouseEvent; import java.awt.event.MouseListener; import java.awt.event.WindowAdapter; import java.awt.event.WindowEvent; import javax.swing.JFrame; import

ListView使用自定义适配器的情况下实现适配器的控件点击事件执行Activity界面中的方法

如果ListView使用的是自定义的适配器,比如MyArrayAdapter extends ArrayAdapter<String> 那么,如何实现适配器中的点击事件执行activity界面中的方法呢? 实现思路:在自定义适配器MyArrayAdapter 类型中自定义接口和接口方法,然后在activity界面中MyArrayAdapter实例实现这个接口. 较为完整的代码见上文. 1.MyArrayAdapter 关键代码 自定义接口和方法的代码如下: //列表项的单击事件监听接口 pub