如何使用滑块和调整大小属性调整图像大小

Question

我正在使用jquery ui滑块，我希望用户能够使用滑块的resize属性来调整图像大小。我不确定如何使它工作。任何建议或想法将不胜感激。

awk

https://jsfiddle.net/davadi/8dw0c4an/9/

Answer 1

使用onclick函数获取滑块的值，并使用该值从图像的宽度中增加或减少。

$(function () {
var pre_val = 0;
$("#slider-range-min").click(function(){
    var val = $('#slider-range-min').slider("option", "value");

  var width_img = $(".bgSizeContain").width()
  if(val>pre_val){
    width_img += val
  } else {
    width_img -= val
 }
        pre_val = val;

$(".bgSizeContain").width(width_img)
    })
$("#slider-range-min").slider({change: function(event, ui) {console.log('It Works!')}});

});

Link到jsfiddle