日期:2014-05-16 浏览次数:20493 次
<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
* {
margin:0; padding:0;
font-size:12px;
}
input {
display:block;
width:500px;
}
img {display:block;}
body {
height:100%;
}
.w {
display:none;
position:absolute; left:0; top:0; z-index:999;
width:100%; height:100%;
background:#000;
filter:alpha(opacity=40); opacity:.4;
}
</style>
</head>
<body>
<input id="a" value="http://avatar.profile.csdn.net/A/3/8/2_zqz4987.jpg" />
<div class="w" id="wrap"></div>
<script>
function $(el){
return typeof el == 'string' ? document.getElementById(el) : el;
}
function $t(name, cot){
cot = cot || document;
return cot.getElementsByTagName(name);
}
var re = /^http.+jpg$/i;
$('a').ondblclick = function(){
if( re.test(this.value) ){
$('wrap').style.display = 'block';
var div = document.createElement('div');
div.style.cssText = 'border:1px solid red; padding:1px; z-index:1000; position:absolute;'
div.innerHTML = '<div style="border-bottom:1px solid red; padding-right:10px; background:#fff; line-height:22px; cursor:pointer; text-align:right;">关闭X</div><img src="'+this.value+'" />';
document.body.appendChild(div);
$t('div', div)[0].onclick = function(){
$('wrap').style.display = 'none';
document.body.removeChild(div);
}
}
}
</script>
</body>
</html>
------解决方案--------------------
你这叫粗糙?
那我们情何以堪。。。。。。。