JS to achieve image amplification and drag-and-drop effect code sharing _JAVASCRIPT Skills

This article describes the JS implementation of the image amplification and drag-and-drop effect code. Share to everyone for your reference. Specifically as follows:
JS to achieve image amplification and drag-and-drop effect is a very practical JS special effects, the realization of the image zooming and dragging function, no use of jquery plug-ins, is implemented with native JavaScript, in addition to clicking the Zoom and Zoom Out button to control the image zoom, you can also use the mouse wheel control picture scaling.
Run Effect chart:----------------------View effect source Download-----------------------

Tip: If you are not running properly in your browser, you can try switching browsing mode.
For everyone to share the JS implementation picture amplification and drag effect code as follows

<! DOCTYPE html> 
function Onwheelzoom (obj) {//wheel scaling
 zoom = parsefloat (obj.style.zoom);
 Tzoom = Zoom + (event.wheeldelta>0? 0.05: -0.05);
 if (tzoom<0.1) return true;
 Obj.style.zoom=tzoom;
 return false;
}

JS Key code:

Drag = 0 move = 0 var ie=document.all;
var nn6=document.getelementbyid&&!document.all;
var Isdrag=false;
var y,x;

var odragobj;
 function Movemouse (e) {if (Isdrag) {oDragObj.style.top = (nn6? nty + e.clienty-y: Nty + event.clienty-y) + "px";
 ODragObj.style.left = (nn6 NTX + e.clientx-x: NTX + event.clientx-x) + "px";
 return false;
 } function Initdrag (e) {var odraghandle = nn6? e.target:event.srcelement;
 var topelement = "HTML"; while (Odraghandle.tagname!= topelement && odraghandle.classname!= "dragable") {Odraghandle = nn6? odraghandl
 E.parentnode:odraghandle.parentelement;
 } if (odraghandle.classname== "dragable") {Isdrag = true;
 Odragobj = Odraghandle;
 Nty = parseint (odragobj.style.top+0); y = nn6?
 E.clienty:event.clienty;
 NTX = parseint (odragobj.style.left+0); x = nn6?
 E.clientx:event.clientx;
 Document.onmousemove=movemouse;
 return false;
}} Document.onmousedown=initdrag; Document.onmouseup=new Function ("Isdrag=falSe ");
 function Clickmove (s) {if (s== "up") {dragObj.style.top = parseint (dragObj.style.top) + 100;
 }else if (s== "down") {dragObj.style.top = parseint (dragObj.style.top)-100;
 }else if (s== "left") {DragObj.style.left = parseint (dragObj.style.left) + 100;
 }else if (s== "right") {DragObj.style.left = parseint (dragObj.style.left)-100;   
 } function Smallit () {var height1=images1.height;   
 var width1=images1.width;   
 images1.height=height1/1.2;   
images1.width=width1/1.2;   
 function Bigit () {var height1=images1.height;   
 var width1=images1.width;   
 images1.height=height1*1.2;   
images1.width=width1*1.2;  
 function Realsize () {images1.height=images2.height;
 Images1.width=images2.width;
 Block1.style.left = 0;
 
block1.style.top = 0;   
 function Featsize () {var width1=images2.width;   
 var height1=images2.height;   
 var width2=701;   
 var height2=576;
 var h=height1/height2;
 var w=width1/width2; if (HEIGHT1<HEIGHT2&&WIDTH1<WIDTH2) {images1.height=height1;   
 Images1.width=width1;   
 } else {if (h>w) {images1.height=height2;   
 images1.width=width1*height2/height1;   
 else {images1.width=width2;   
 Images1.height=height1*width2/width1;
 } block1.style.left = 0;
block1.style.top = 0; } function Onwheelzoom (obj) {//wheel scaling zoom = parsefloat (obj.style.zoom); tzoom = zoom + (event.wheeldelta>0? 0.05:-0.)
05);
if (tzoom<0.1) return true;
Obj.style.zoom=tzoom;
return false; }

The above is for everyone to share the JS implementation picture amplification and drag effect code, I hope you can like.