求一个asp显示本地图片的代码
完成多个附件上传功能,在点击浏览选择本地图片后,在鼠标移动到这个显示本地图片路径的input的时候打开一个div用来显示这个图片等操作者确认后,再批量上传...
完成多个附件上传功能,在点击浏览选择本地图片后,在鼠标移动到这个显示本地图片路径的input的时候打开一个div用来显示这个图片
等操作者确认后,再批量上传 展开
等操作者确认后,再批量上传 展开
1个回答
展开全部
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>test</title>
<script language="JavaScript">
<!--
var srcX = 1024; //原图大小,可以任意设置
var srcY = 768;
var bigX = 600; //预览窗大小,可以任意设置
var bigY = 400;
var smallX = 300; //缩略图宽度
var smallY = srcY * smallX / srcX;
var ax = bigX / srcX * smallX; //预览范围
var ay = bigY / srcY * smallY;
var bl = srcX / smallX;//缩小比例
var border = 1; //边框
window.onload=function (){
smallpic.width=smallX;
smallpic.height=smallY;
bigpic.width=srcX;
bigpic.height=srcY;
at.style.width=ax;
at.style.height=ay;
b.style.borderWidth=border;
bigbox.style.borderWidth=border;
if (window.event){
b.style.width=smallpic.offsetWidth+border*2;
b.style.height=smallpic.offsetHeight+border*2;
bigbox.style.width=bigX+border*2;
bigbox.style.height=bigY+border*2;
}else{
b.style.width=smallpic.offsetWidth;
b.style.height=smallpic.offsetHeight;
bigbox.style.width=bigX;
bigbox.style.height=bigY;
}
move(event);
}
function move(e){
var e = window.event?window.event:e;
var iebug = 0;
if (window.event){
var vX = e.offsetX - ax/2;
var vY = e.offsetY - ay/2;
}else{
var vX = e.pageX - ax/2 - b.offsetLeft - border;
var vY = e.pageY - ay/2 - b.offsetTop - border;
iebug = 2;
}
if (vX < 0) vX = 0;
if (vY < 0) vY = 0;
if (vX > smallX - ax - iebug) vX = smallX - ax - iebug;
if (vY > smallY - ay - iebug) vY = smallY - ay - iebug;
bigpico.style.marginLeft = - vX * bl
bigpico.style.marginTop = - vY * bl
at.style.left = vX + b.offsetLeft + border;
at.style.top = vY + b.offsetTop + border;
}
//-->
</script>
<style type="text/css">
<!--
*{padding:0;margin:0}
img{display:block;}
#b{border:1px #c33 solid;float:left;width:0;height:0;overflow:hidden}
#bigbox{border:1px #c33 solid;width:0px;height:0px;float:left;overflow:hidden}
#at{border:1px #ddd solid;width:0px;height:0px;position:absolute}
#a{text-align:center;line-height:40px;font:bold 16px/40px;color:red}
//-->
</style>
<div id="a"></div>
<div id="b"><img src="a.gif" name="smallpic" width="300" height="300" border="0" id="smallpic" onmousemove="move(event)" onmouseover="document.getElementById('bigbox').style.display='';document.getElementById('at').style.display=''" onmouseout="document.getElementById('bigbox').style.display='none';document.getElementById('at').style.display='none'"></div>
<div id="bigbox" style="display:none"><div id="bigpico"><img src="a.gif" name="bigpic" width="300" height="300" border="0" id="bigpic"></div>
</div>
<div id="at" onmousemove="move(event) "style="display:none"></div>
<title>test</title>
<script language="JavaScript">
<!--
var srcX = 1024; //原图大小,可以任意设置
var srcY = 768;
var bigX = 600; //预览窗大小,可以任意设置
var bigY = 400;
var smallX = 300; //缩略图宽度
var smallY = srcY * smallX / srcX;
var ax = bigX / srcX * smallX; //预览范围
var ay = bigY / srcY * smallY;
var bl = srcX / smallX;//缩小比例
var border = 1; //边框
window.onload=function (){
smallpic.width=smallX;
smallpic.height=smallY;
bigpic.width=srcX;
bigpic.height=srcY;
at.style.width=ax;
at.style.height=ay;
b.style.borderWidth=border;
bigbox.style.borderWidth=border;
if (window.event){
b.style.width=smallpic.offsetWidth+border*2;
b.style.height=smallpic.offsetHeight+border*2;
bigbox.style.width=bigX+border*2;
bigbox.style.height=bigY+border*2;
}else{
b.style.width=smallpic.offsetWidth;
b.style.height=smallpic.offsetHeight;
bigbox.style.width=bigX;
bigbox.style.height=bigY;
}
move(event);
}
function move(e){
var e = window.event?window.event:e;
var iebug = 0;
if (window.event){
var vX = e.offsetX - ax/2;
var vY = e.offsetY - ay/2;
}else{
var vX = e.pageX - ax/2 - b.offsetLeft - border;
var vY = e.pageY - ay/2 - b.offsetTop - border;
iebug = 2;
}
if (vX < 0) vX = 0;
if (vY < 0) vY = 0;
if (vX > smallX - ax - iebug) vX = smallX - ax - iebug;
if (vY > smallY - ay - iebug) vY = smallY - ay - iebug;
bigpico.style.marginLeft = - vX * bl
bigpico.style.marginTop = - vY * bl
at.style.left = vX + b.offsetLeft + border;
at.style.top = vY + b.offsetTop + border;
}
//-->
</script>
<style type="text/css">
<!--
*{padding:0;margin:0}
img{display:block;}
#b{border:1px #c33 solid;float:left;width:0;height:0;overflow:hidden}
#bigbox{border:1px #c33 solid;width:0px;height:0px;float:left;overflow:hidden}
#at{border:1px #ddd solid;width:0px;height:0px;position:absolute}
#a{text-align:center;line-height:40px;font:bold 16px/40px;color:red}
//-->
</style>
<div id="a"></div>
<div id="b"><img src="a.gif" name="smallpic" width="300" height="300" border="0" id="smallpic" onmousemove="move(event)" onmouseover="document.getElementById('bigbox').style.display='';document.getElementById('at').style.display=''" onmouseout="document.getElementById('bigbox').style.display='none';document.getElementById('at').style.display='none'"></div>
<div id="bigbox" style="display:none"><div id="bigpico"><img src="a.gif" name="bigpic" width="300" height="300" border="0" id="bigpic"></div>
</div>
<div id="at" onmousemove="move(event) "style="display:none"></div>
追问
你这个还不是本地的图片呀
追答
上面放路径就可以
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询