您的位置:首页 > Web前端 > JavaScript

js小技巧--鼠标滑过显示大图

2008-11-22 14:22 211 查看
记些小技巧,方便大家方便自己。

直接来代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

2

3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

4

5<html xmlns="http://www.w3.org/1999/xhtml" >

6<head runat="server">

7 <title>无标题页</title>

8

9<script language="javascript" type="text/javascript">

10//显示大图

11

21//隐藏大图

22</script>

27

28

29</head>

30<body>

31

32 <form id="form1" runat="server">

33 <div>

34 <%--显示大图片的层,样式比较简单大家可以自己定义--%>

35 <div id="picLayer" style="display:none;position:absolute;z-index:1;"></div>

36

37 <%--显示图片--%>

38 <img src="mypic.jpg" onmouseout="hiddenPic();" onmousemove="showPic(this.src);" width="200" height="100" alt="哈哈"/>

39

40

41 </div>

42 </form>

43</body>

44</html>

45

很简单,有注释。有更好的方法请指教。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: