动态更改css backgroundPosition左和顶部通过jquery

我是一个新的程序员和英语不是我的母语，所以请提前原谅我的编程和英语错误。动态更改css backgroundPosition左和顶部通过jquery

这就是我想要做的：我有一个div标签，其中包含一个图像和一个表格（在这个div标签之外）。通过jquery我试图archieve“裁剪效果”，所以我让我的桌子拖动，而拖动我复制图像，并将其设置为我的桌子上的背景。现在我需要能够动态设置表格中图像的背景位置，因此拖动图片时显示为静止。裁剪效果通过改变（降低）原始图像上的不透明度来存档。请注意，我不需要创建一个选择或类似的东西。该表首先以给定的大小创建。完成此操作后，将表格拖到创建裁剪效果的图像上。

这是我的问题：当我通过jquery（.css）设置背景图像的位置时，它不会更改顶部位置，并且左侧位置不能按预期工作。

让我们来看看javascript代码：

<script type="text/javascript"> 

$(function() { 
    $("#myTable").draggable({ 
     drag:function() { 
      //$("#myTable").css("opacity", "0.6"); 
      var $img = $("img").clone(); 
      var $src = $img.attr('src'); 
      $("#myTable").css("background-image", 'url(' + $src + ')'); 
      $position = $("#myTable").position(); 

      $("#myTable").css({ 
       backgroundPosition: -parseInt($position.left) + -parseInt($position.top)}); 
     }, 
     stop:function() { 
      //$("#myTable").css("opacity", "1.0"); 
      $("#div1").css("opacity", "0.6"); 
     } 
    }); 
}); 

</script>

背景的位置设置不正确，但现在它没有太大的关系的时刻。我只希望有一种方法可以动态地改变最高职位，我将在后面担心数学问题。我也希望它很清楚。亲切的问候，

艾琳

来源

2010-11-22 Arha

的background-position CSS属性可以取两个参数，用空格分隔：

$("#myTable").css("backgroundPosition", (-parseInt($position.left)).toString() 
    + "px " + (-parseInt($position.top)).toString() + "px");

来源

2010-11-22 10:43:40

backgroundPosition: -parseInt($position.left)+'px ' + -parseInt($position.top) + 'px'});

尝试指定计量单位

来源

2010-11-22 10:38:58

我已经尝试，没有工作......但无论如何谢谢你，我真的很感激你对我的问题感兴趣。对于将来我会说我不认为这是一个语法错误（至少我不希望），我已经尝试过所有可能的组合XD。现在的语法是唯一一个在背景位置上实际产生一些结果的东西，否则它什么都不做......只是设置背景。 – Arha 2010-11-22 10:47:26

可能它会错过左侧和顶部位置之间的空间。编辑：正如Frédéric指出:) – 2010-11-22 10:49:03

动态更改css backgroundPosition左和顶部通过jquery

回答

相关问题