介绍 & lt; ! DOCTYPE html>
& lt; html lang=癳n"祝辞
& lt; head>
& lt;才能meta charset=癠TF-8"比;
& lt;才能meta name=皏iewport",内容=翱矶?设备宽度,初始=1.0,比;
& lt;才能meta http-equiv=癤-UA-Compatible",内容=癷e=edge"比;
& lt;才能title> Document</title>
& lt;才能style>
,,,* {
,,,,,填充:,0;
,,,,,保证金:0;
,,,}
,,,.div1 {
,,,,,宽度:,200 px;
,,,,,身高:,200 px;
,,,,,背景颜色:,# 71 e4ff;
,,,,,位置:,绝对;
,,,,,:,200 px;
,,,,,左:,200 px;
,,,}
,,,.t,
,,,。b {
,,,,,宽度:,100%;
,,,,,身高:,20 px;
,,,,,background - color: # ffa2d3;
,,,,,位置:,绝对;
,,,}
,,,.t {
,,,,,左:,0;
,,,,,:0;
,,,}
,,,。b {
,,,,,左:,0;
,,,,,底部:0;
,,,}
,,,r,
,,,.l {
,,,,,宽度:,20 px;
,,,,,身高:,100%;
,,,,,background - color: # ffa2d3;
,,,,,位置:,绝对;
,,,}
,,,r {
,,,,,对的:,0;
,,,,,:0;
,,,}
,,,.l {
,,,,,左:,0;
,,,,,:0;
,,,}
,,,使,
,,,.lb,
,,,.rt,
,,,. rb {
,,,,,宽度:,20 px;
,,,,,身高:,20 px;
,,,,,背景颜色:,# 93 ff6b;
,,,,,位置:,绝对;
,,,}
,,,使{
,,,,,左:,0;
,,,,,:0;
,,,}
,,,.rt {
,,,,,对的:,0;
,,,,,:0;
,,,}
,,,.lb {
,,,,,左:,0;
,,,,,底部:,0;
,,,}
,,,. rb {
,,,,,对的:,0;
,,,,,底部:0;
,,,}
,,,,
& lt;才能/style>
& lt;/head>
& lt; body>
& lt;才能div 类=癲iv1", id=癬div1"比;
,,,& lt; div 类=皌"祝辞& lt;/div>
,,,& lt; div 类=皉"祝辞& lt;/div>
,,,& lt; div 类=癰"祝辞& lt;/div>
,,,& lt; div 类=發"祝辞& lt;/div>
,,,& lt; div 类=發t"祝辞& lt;/div>
,,,& lt; div 类=發b"祝辞& lt;/div>
,,,& lt; div 类=皉t"祝辞& lt;/div>
,,,& lt; div 类=皌b"祝辞& lt;/div>
& lt;才能/div>
& lt;/body>
& lt;/html>
& lt; script>//,才能获取元素
var 才能;_div1 =, . getelementbyid (“_div1");
var 才能;divs =, _div1.children;//才能,遍历每个可以拖拽的元素
,,(var 小姐:=,0;小姐:& lt;, divs.length ;我+ +)
{才能
,,,拖(div[我]);
,,}//,才能封装一个拖拽函数
,,function 阻力(obj) {
,,,obj.onmousedown =,函数(事件){
,,,,,//,捕获事件
,,,,,var event =, event | |, window.event;
,,,,,//,存储当前的_div1的宽高
,,,,,var divW =, _div1.offsetWidth;
,,,,,var divH =, _div1.offsetHeight;
,,,,,//,获得当前_div1的offsetLeft 和offsetTop
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
这期内容当中小编将会给大家带来有关使用JavaScript怎么实现拖拽图形伸缩效果,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。
