会python真的可以为所欲为0(回)
350天前
这里还有人吗1(回)
535天前这里还有人吗0(回)
535天前
每天面对着电脑屏幕，敲打键盘。我所面对的并不只是代码，而是一种生活方式。0(回)
760天前到处都是羊，不想上班0(回)
840天前
鸽子
0(回)
844天前
jquery 鼠标放上 图片大图预览.rar(免费下载)[3 次下载]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" |
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
<html xmlns="http://www.w3.org/1999/xhtml"> |
<head> |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
<title>图片提示</title><!-- 引入jQuery --> |
<script src="./jquery-1.3.1.js" type="text/javascript"> |
</script> |
<style type="text/css"> |
/*<![CDATA[*/ |
body{ |
margin:0; |
padding:40px; |
background:#fff; |
font:80% Arial, Helvetica, sans-serif; |
color:#555; |
line-height:180%; |
} |
img{border:none;} |
ul,li{ |
margin:0; |
padding:0; |
} |
li{ |
list-style:none; |
float:left; |
display:inline; |
margin-right:10px; |
border:1px solid #AAAAAA; |
} |
/* tooltip */ |
#tooltip{ |
position:absolute; |
border:1px solid #ccc; |
background:#333; |
padding:2px; |
display:none; |
color:#fff; |
} |
/*]]>*/ |
</style> |
<script type="text/javascript"> |
//<![CDATA[ |
$(function(){ |
var x = 10; |
var y = 20; |
$("a.tooltip").mouseover(function(e){ |
this.myTitle = this.title; |
this.title = ""; |
var imgTitle = this.myTitle? "<br/>" + this.myTitle : ""; |
var tooltip = "<div id='tooltip'><img src='"+ this.href +"' alt='产品预览图'/>"+imgTitle+"<\/div>"; //创建 div 元素 |
$("body").append(tooltip); //把它追加到文档中 |
$("#tooltip") |
.css({ |
"top": (e.pageY+y) + "px", |
"left": (e.pageX+x) + "px" |
}).show("fast"); //设置x坐标和y坐标，并且显示 |
}).mouseout(function(){ |
this.title = this.myTitle; |
$("#tooltip").remove(); //移除 |
}).mousemove(function(e){ |
$("#tooltip") |
.css({ |
"top": (e.pageY+y) + "px", |
"left": (e.pageX+x) + "px" |
}); |
}); |
}) |
//]]> |
</script> |
</head> |
<body> |
<ul> |
<li><a href="images/apple_1_bigger.jpg" class="tooltip" title="苹果 iPod"><img src="images/apple_1.jpg" alt="苹果 iPod" /></a></li> |
<li><a href="images/apple_2_bigger.jpg" class="tooltip" title="苹果 iPod nano"><img src="images/apple_2.jpg" alt="苹果 iPod nano" /></a></li> |
<li><a href="images/apple_3_bigger.jpg" class="tooltip" title="苹果 iPhone"><img src="images/apple_3.jpg" alt="苹果 iPhone" /></a></li> |
<li><a href="images/apple_4_bigger.jpg" class="tooltip" title="苹果 Mac"><img src="images/apple_4.jpg" alt="苹果 Mac" /></a></li> |
</ul> |
</body> |
</html> |
jquery 鼠标放上 图片大图预览.rar(免费下载)[3 次下载]
