未分类

www6766comjavascript实现的图片预览功能_javascript技巧_脚本之家

18 3月 , 2020  

本文实例讲述了javascript实现的图片预览功能。分享给大家供大家参考,具体如下:

1.将下面的代码复制到

/*Thumbnail image viewer-?Dynamic Drive For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com*/function enlarge{//Render image code for IE 4+if {if (showimage.style.visibility=="hidden"){showimage.style.left=document.body.scrollLeft+event.clientXshowimage.style.top=document.body.scrollTop+event.clientYshowimage.innerHTML='<img src="'+which+'">'showimage.style.visibility="visible"}elseshowimage.style.visibility="hidden"return false}//Render image code for NS 4else if {if (document.showimage.visibility=="hide"){document.showimage.document.write('<a href="#" rel="external nofollow" onMouseover="drag_dropns"><img src="'+which+'" border=0></a>')document.showimage.document.close()document.showimage.left=e.xdocument.showimage.top=e.ydocument.showimage.visibility="show"}elsedocument.showimage.visibility="hide"return false}//if NOT IE 4+ or NS 4, simply display image in full browser windowelsereturn true}//By Dynamicdrive.com//drag drop function for NS 4/////////////////////////////////////var nsxvar nsyvar nstempfunction drag_dropnstemp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP)temp.onmousedown=gonstemp.onmousemove=dragnstemp.onmouseup=stopns}function gons{temp.captureEventsnsx=e.xnsy=e.y}function dragns{temp.moveByreturn false}function stopns(){temp.releaseEvents}//drag drop function for IE 4+/////////////////////////////////////var dragapproved=falsefunction drag_dropie(){if {document.all.showimage.style.pixelLeft=tempx+event.clientX-iexdocument.all.showimage.style.pixelTop=tempy+event.clientY-ieyreturn false}}function initializedragie(){if (event.srcElement.parentElement.id=="showimage"){iex=event.clientXiey=event.clientYtempx=showimage.style.pixelLefttempy=showimage.style.pixelTopdragapproved=truedocument.onmousemove=drag_dropie}}if {document.onmousedown=initializedragiedocument.onmouseup=new Function}

2.在

中加入复制代码 代码如下:

3.在连接图片的地方这样写复制代码
代码如下:www6766com 1

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript图片操作技巧大全》、《JavaScript切换特效与技巧总结》、《JavaScript图形绘制技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。


相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图