87,997
社区成员




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<style type="text/css">
img{width:100px; height:100px;}
.dispDiv{position:absolute;width:500px; height:500px;display:none;}
.shadow {width:500px; height:500px;background:#000;filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='5', MakeShadow='true', ShadowOpacity='0.60');}
.frame {position:relative; background:#fff; padding:10px; display:block;left:10px; top:10px;
-moz-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
}
.close{
position:absolute;width: 40px; height: 40px; display:none;
}
</style>
<script language="javascript" src="C:\Documents and Settings\wangguanquan\My Documents\jquery.js"></script>
</head>
<body>
<img src="ui-icons_222222_256x240.png"/>
<div class="dispDiv"><div class="shadow"><img src="" class="frame"/></div></div>
<img src="close.bmp" class="close"/>
<script language="javascript">
var speed = 200;
$(document).click(function(event){
if ('IMG' != event.target.tagName) {
$('.dispDiv,.close').hide(speed);
}
});
$("img:not('.frame,.close')").click(function(){
$('.shadow>img').attr('src', $(this).attr('src')).css({width:'491px', height:'490px'});
$('.dispDiv').show(speed).css({top:(screen.height/2-300)+'px',left:(screen.width/2-300)+'px'});
$('.close').show(speed).css({top:($('.dispDiv').offset().top-10)+'px', left:($('.dispDiv').offset().left+500-20)+'px'})
});
$('.close').click(function(){
$('.dispDiv,.close').hide(speed);
});
</script>
</body>
</html>