Contoh -contoh dalam artikel ini berbagi gambar secara perlahan memperbesar dan mengurangi kode implementasi JS untuk referensi Anda. Konten spesifiknya adalah sebagai berikut
<! Doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <itement> penskalaan lambat gambar </title> </geteLementById <cript> window.onload = function () {var btn_big = document.geteLementById ("BIG"); var btn_small = document.getElementById ("kecil"); var pic = document.getElementById ("pic"); // Perlahan zoom btn_big.onClick = function () {var width = parseInt (pic.style.width); var i = lebar; var count = 0; console.log (lebar); var timer = setInterval (function () {count ++; i ++; pic.style.width = i+"%"; if (count == 10) {clearInterval (timer);} lain jika (i> 50) {btn_big.onclick = function (e) {btn_big.onclick = nullick = nullick = null; nol; noul; }; // perlahan -lahan menyusut btn_small.onClick = function () {var width = parseInt (pic.style.width); var count = 0; if (width == 10) {alert ("Gambar sudah minimal !!"); mengembalikan false; } console.log (lebar); var timer2 = setInterval (function () {count ++; width--; pic.style.width = width+"%"; if (count == 10) {clearInterval (timer2);} lain jika (lebar <10) {btn_small.onclick = null;}}, 13); }}} </script> <tyle> #pic {width: 20%; } </tyle> <body> <v id = "pic"> <img src = "3.pic.jpg"> </div> <div> <tombol id = "besar"> zoom in </button> <button id = "small"> zoom out </button> </div> </buttml>Di atas adalah semua konten artikel ini. Saya berharap ini akan membantu untuk pembelajaran semua orang dan saya harap semua orang akan lebih mendukung wulin.com.