<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="images/blue/css.css" rel="stylesheet" type="text/css" id="showdialogcss" />
<script>
function showlianxi(status,ev){
var e= ev||window.event;
var show = document.getElementById('showlianxi');
var obj=e.target||e.srcElement;
switch(status){
case 'over':
show.style.position='absolute';
if(e.pageX){
show.style.left=e.pageX+20+'px';
show.style.top=e.pageY+'px';
}
else{
show.style.left=e.clientX + document.body.scrollLeft+ document.documentElement.scrollLeft+5;
show.style.top=e.clientY + document.body.scrollTop+ document.documentElement.scrollTop+5;
}
show.style.display='block';
break;
case 'out':
show.style.display='none';
break;
}
}
</script>
<style type="text/css">
#showlianxi{
background:url(images/lianxibg.jpg) no-repeat;
width:175px;
height:62px;
padding:20px 0px 0px 8px;
display:none;
z-index:100;
display:none;
}
#showlianxi .phoneimg{
float:left;
padding-right:7px;
}
#showlianxi .phone{float:left; font-size:11px;}
.pin_name{
background:url(images/min1.gif) no-repeat;
line-height:28px;
font-weight:bold;
text-align:center;
margin:0 auto;
width:148px;
border:1px solid #ccc;
}
</style>
</head>
<body>
<div class="pin_name" onmouseover="showlianxi('over',event)" onmouseout="showlianxi('out',event)">
<a class="black" href="/store/store.action?id=1">百事公司</a>
</div>
<br />
<div class="pin_name" onmouseover="showlianxi('over',event)" onmouseout="showlianxi('out',event)">
<a class="black" href="/store/store.action?id=1">百事公司</a>
</div>
<div id="showlianxi" onmouseover="showlianxi('over',event)" onmouseout="showlianxi('out',event)">
<div style="height:25px;line-height:25px;">
<div class="phoneimg"><img src="http://www.iteye.com/images/icon_minigender_1.gif?1192779195" width="16" height="14" /></div>
<div class="phone"></div>
<div class="clear"></div>
</div>
<div style="height:25px;line-height:25px;">
<div class="phoneimg"><img src="http://www.iteye.com/images/icon_minigender_1.gif?1192779195" width="16" height="15"/></div>
<div class="float_left"></div>
<div class="clear"></div>
</div>
</div>
</body>
</html>
分享到：
相关推荐
本主题聚焦于“鼠标移动显示图片”的JS代码实现，这通常涉及到事件监听、DOM操作以及图片加载等多个方面。下面将详细介绍这个功能的实现原理和步骤。 首先，我们需要理解JS中的事件监听。在本例中，我们关注的是`...
当鼠标指向某一个连接或标签时，就会显示相应的详细信息，鼠标移开时，信息就消失
鼠标移动表格行上行变色的JS脚本,鼠标移动表格行上行变色的JS脚本,
为了实现在鼠标移动到 DataGrid 的某一行时显示详细信息这一功能，通常有两种方式：一种是通过 JavaScript 或 jQuery 来实现，另一种是利用 ASP.NET 的服务器端事件来实现。本文采用的是结合 JavaScript 和 ASP.NET ...
在本案例中，"js鼠标浮动显示div"指的是当鼠标移动到特定的input元素上时，会显示出一个div层，该div层中包含有与input相关的附加信息或者功能。 首先，我们需要了解几个关键的概念： 1. **事件监听器**：...
在JavaScript（JS）编程中，实现“鼠标滑过图片，在图片上方蒙上一层透明层显示详情内容”的功能是一项常见的交互设计。这个功能可以提升用户体验，让用户在不离开当前页面的情况下查看图片的相关信息。下面我们将...
在JavaScript的世界里，实现"JS 鼠标移动伞形特效"是一种有趣且富有创意的交互设计。这种特效通常用于增强用户体验，使网站或应用更具吸引力。以下将详细讲解实现这个特效所需的关键知识点： 首先，我们需要理解...
现在，我们需要使用JavaScript（这里我们可以使用jQuery库，因为它简洁易懂）来监听"hover-div"的`mouseover`和`mouseout`事件，以便在鼠标进入和离开时显示和隐藏"info-div"。同时，我们还需要计算"info-div"的显示...
- **JavaScript**: 使用JavaScript来编写逻辑处理代码，实现鼠标移动时坐标值的获取与显示。 - **AJAX**: 异步JavaScript和XML技术，用于在不重新加载整个网页的情况下与服务器交换数据并更新部分网页内容。 - **DOM...
在IT领域，尤其是在网页开发和交互设计中，实时显示鼠标移动位置是一项常见的需求。这个功能可以帮助用户更好地理解和操作界面，特别是在需要精确控制元素位置或进行游戏等应用时。标题"鼠标移动位置数值的实时显示...
本项目所介绍的就是一种这样的技术——“跟随鼠标移动的十字坐标显示”。这个小功能可以在用户鼠标在页面上移动时，实时地显示一个十字架标记，指示出鼠标的当前位置，给人一种酷炫且个性化的视觉效果。 要实现这个...
js javascript 鼠标 坐标 移动速度 方向 角度
在JavaScript编程中，创建一个移动层（通常是指在网页上浮动的元素）并使其跟随鼠标移动是一项常见的交互设计任务。这种效果可以用于制作提示框、广告条或任何需要随用户鼠标移动而移动的元素，提升用户体验。在这个...
"JavaScript鼠标移动放大图片特效"是一种常见的网页交互功能，它允许用户在鼠标悬停在图片上时看到图片的放大效果，提升了浏览者的视觉体验。 实现这一特效主要涉及以下几个技术点： 1. **事件监听**：首先，我们...
【基于Threejs的鼠标移动图片跟随变形动画特效】是一个利用HTML5库Three.js实现的交互式视觉效果。Three.js是一个强大的JavaScript库，专门用于在Web浏览器中创建和展示3D图形，无需用户安装任何插件。它使得Web...
本教程将深入探讨如何利用SuperMap iClient 6R for JavaScript库来实现一个功能，即当鼠标移动到地图上时，实时显示当前鼠标的地理坐标。SuperMap是一款强大的GIS软件，其iClient系列为开发者提供了丰富的JavaScript...
根据网上文档修改的，网上的都不能用，现在这个在火狐浏览器不能用
鼠标移动切换内容的效果基于JavaScript或者CSS3的事件监听和动画效果。当鼠标移动到某个元素上时，通过JavaScript的mouseover或mouseenter事件触发内容的切换；而离开时，利用mouseout或mouseleave事件恢复原状。...
在计算机图形用户界面中，鼠标是用户与操作系统交互的重要工具，而“鼠标移动显示坐标点”这一功能则是开发者为了提供更精确的操作反馈所设计的一种机制。这个功能通常出现在图形编辑软件、游戏开发环境或者编程环境...
接下来，我们要实现"鼠标跟随div"，即当鼠标移动时，显示的详细内容div应该跟随着鼠标的位置。这需要用到JavaScript的事件对象（event object）来获取鼠标的坐标，然后更新div的位置。可以使用`event.clientX`和`...