บทความนี้อธิบายวิธีการขยายลดและลากรูปภาพโดย JS แบ่งปันสำหรับการอ้างอิงของคุณดังนี้:
var divid; var v_left; var v_top; window.onload = function () {divid = document.getElementById ("block1"); var height1 = images1.height; // ความสูงของภาพ var width1 = images1.width; // ความกว้างของภาพ v_left = (document.body.clientwidth-width1)/2; v_top = (document.body.clientheight-height1) /2; divid.style.left=v_left;divid.style.top=v_top;} drag = 0; ย้าย = 0; isdrag = false; var y, x; var odragobj; ฟังก์ชั่น movemouse (e) {ถ้า (isdrag) {odragobj.style.top = (nn6? nty + e.clienty - y: nty + event.clienty - y) + "px"; - x) + "px"; return false;}} // drag วิธีการฟังก์ชัน initdrag (e) {var odraghandle = nn6? E.Target: Event.srecelement; var topelement = "html"; ในขณะที่ (odraghandle.tagname! = topelement && odraghandle.classname! = "dragable") {odraghandle = nn6? odraghandle.parentnode: odraghandle.parentelement;} ถ้า (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; // document.onmouseup = mup; // เหตุการณ์จะเกิดขึ้นเมื่อปุ่มเมาส์ถูกปล่อยออกมา;}} document.onmousedown = initdrag; document.onmouseup = ฟังก์ชั่นใหม่ ("isdrag = false"); parseint (dragobj.style.top) + 100;} else {ถ้า (s == "ลง") {dragobj.style.top = parseint (dragobj.style.top) - 100;} else {ถ้า (s == "left") "ขวา") {dragobj.style.left = parseint (dragobj.style.left) - 100;}}}}}}} // หดฟังก์ชั่นหลายฟังก์ชั่นเล็ก ๆ 1.1;} // ฟังก์ชั่นซูม bigit () {/*// ซูมภาพโดยไม่สูญเสีย Hot Spot Var Zoom = ParseInt (images1.style.zoom, 10) || 100; ซูม += event.wheeldelta/ 12; ถ้า (ซูม> 0) {images1.style.zoom = (ซูม +10) +"%";} * /// ซูมเข้าและสูญเสียความสูง hotspot 1 = ภาพ 1.Height; width1 = images1.width; RealSize () {images1.style.zoom = 100+"%"; images1.height = images2.height; images1.width = images2.width; divid.style.left = v_left; divid.style.top = v_top; = 360; var height2 = 200; var h = ความสูง 1 / ความสูง 2; var w = width1 / width2; ถ้า (ความสูง 1 <ความสูง 2 && width1 <width2) {images1.height = ความสูง 1; images1.width = width1; {images1.width = width2; images1.Height = ความสูง 1 * width2/width1;}} block1.style.left = 0; block1.style.top = 0;} // mouse wheel zoom เข้าและออกฟังก์ชั่น bbimg (o) {/ * var elleft; document.documentelement.scrollleft; eletop = document.documentelement.scrolltop;} else {eleleft = document.body.scrollleft; eletop = document.body.scrolltop;} v_left+= eleleft; v_top+= eletop; // divid.style.left = v_left; // divid.style.top = v_top; การแจ้งเตือน ParseInt (O.Style.zoom, 10) || 100; Zoom + = Event.wheelDelta / 12; if (Zoom> 0) {O.Style.zoom = Zoom + "%";} return false;}สำหรับข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาที่เกี่ยวข้องกับ JavaScript โปรดตรวจสอบหัวข้อของไซต์นี้: "JavaScript Switching เอฟเฟกต์พิเศษและเทคนิคสรุป", "JavaScript Animation พิเศษและเทคนิคสรุปเทคนิคการใช้งาน JavaScript และทักษะการใช้งาน Javascript สรุป "," ข้อผิดพลาดของ JavaScript และการดีบักทักษะสรุป "และ" JavaScript Mathematical Operation Summary สรุป "
ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน