通过拖动滑块到JS来控制图片大小的方法。
本文介绍JS使用拖动滑块控制图片大小的方法，供大家参考，具体实现方法如下：复制代码代码如下所示：
js拖动滑块控件显示图片大小
* { margin: 0；padding: 0；字体大小：12px；}
。- {宽度：50px；高度：15px；鼠标指针；}
# picviewpanel {保证金：5 500 50px；宽度：328px；身高：248px；溢出：汽车；文本对齐：中心；border: solid 1px # cccccc；}
#滑块{ margin: 0 50px；高度：15px；宽度：328px；边框1px solid # 000000；位置：相对；}
# sliderleft {身高：13px；宽度：13px；浮动：左；边框1px solid # cccccc；鼠标指针；}
# sliderblock {身高：13px；宽度：50px；边框1px solid # cccccc；位置：绝对的；最高：0；左：113px；鼠标指针；背景：# cccccc；文本对齐：中心；}
# sliderright {身高：13px；宽度：13px；浮动权；边框1px solid # cccccc；鼠标指针；}
= =
/ /雷曼洲
var = null；
var = null；
窗口。指针函数（）{
PV =新picview（ /图像/ M01 .jpg）；
SD =新滑块（
函数（p）{
document.getelementbyid（sliderblock ）.innerHTML = 2×P +%；
pv.expand（2×P / 100）；
（函数）{ }；
}
无功picview =功能（URL、ALT）{
这个；
这个obj = null；
本。alt= altalt：；
这realwidth = null；
这realheight = null；
缩放= 1；
This.init（）；
}
picview。原型。init =函数（）{
无功_img = document.createelement（IMG）；
_img.src = this.url；
_img.alt = this.alt；
_img.style.zoom = this.zoom；
document.getelementbyid（picviewpanel ）AppendChild（_img）；
这_img obj =；
这realwidth = _img.offsetwidth；
这realheight = _img.offsetheight；
}
picview。原型。绑定=函数（）{
this.obj.style.width =这。realwidth *本。变焦+PX；
this.obj.style.height =这。realheight *本。变焦+PX；
/ / this.obj.style.zoom = this.zoom；
}
picview。原型。扩大=功能（N）{
这一点；
This.reBind（）；
}
var滑块=函数（ing，ED）{
这座= document.getelementbyid（sliderblock ）；
this.percent = 0；
this.value = 0；
this.ing = ING；
this.ed = ED；
This.init（）；
}
滑块。init =函数（）{
无功_sx = 0；
无功_cx = 0；
var o = this.block；
我=这个；
o.onmousedown =功能（e）{
var =窗口。事件| | E；
_sx = o.offsetleft；
_cx = e.clientx-_sx；
移动鼠标=移动文件。身体；
文件。身体上onmouseup =；
}；
函数移动（e）{
var =窗口。事件| | E；
无功pos_x = e.clientx - _cx；
pos_x = pos_x＜1313：pos_x；
pos_x = pos_x > 248 + 15-50248 + 15-50：pos_x；
o.style.left = pos_x +PX；
我。% =（pos_x-13） / 2；
Me.ing（我。%）；
}
函数向上（）{
文件。体。移动鼠标=函数（）{ }；
文件。身体。onmouseup =函数（）{ }；
}
}
希望本文能对大家的javaｓｃｒｉｐｔ程序设计有所帮助。