怎么使用JQuery在页面上做一个放大镜
日期：2014-05-17 浏览次数：20460 次
如何使用JQuery在页面上做一个放大镜?
各位大虾,如何使用JQuery在页面上做一个放大镜?我刚刚做完一个网站，想在页面上弄个好玩的东西···想到放大镜，但不知道怎么写。
------解决方案--------------------
各位大虾,如何使用JQuery在页面上做一个放大镜?我刚刚做完一个网站，想在页面上弄个好玩的东西···想到放大镜，但不知道怎么写。
jQuery
------解决方案--------------------
<!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" />
<title>·Å´ó¾µÐ§¹û</title>
<style type="text/css">
body {
margin:0px;
padding:0px;
}
.box {
width:434px;
height:292px;
margin:10px auto;
}
.left {
width:202px;
height:282px;
float:left;
padding:2px;
position:relative;
border:3px solid #ccc;
}
.left img {
float:left;
border:1px solid #7b7b7b;
}
.left .move {
width:50px;
height:50px;
background:#666;
opacity:0.3;
top:3px;
left:3px;
position:absolute;
z-index:1;
display:none;
filter: alpha(opacity: 30);
border:1px solid #000;
}
.left .mask {
width:100%;
height:100%;
opacity:0;
top:0px;
left:0px;
position:absolute;
z-index:2;
background:#000;
cursor:move;
filter:alpha(opacity: 0);
}
.right {
width:202px;
height:282px;
float:left;
padding:2px;
overflow:hidden;
display:inline;
position:relative;
margin:0 0 0 10px;
display:none;
border:3px solid #ccc;
}
.right img {
position:absolute;
top:0px;
left:0px;
}
</style>
<script type="text/javascript">
//获取id
function $(id){
return typeof id === "string" ? document.getElementById(id) : id;
}
//获取tagName
function $$(oParent, elem){
return (oParent
------解决方案--------------------
document).getElementsByTagName(elem);
}
//获取className
function $$$(oParent, sClass){
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
