Question

行。我知道这个话题已被覆盖了一百次。我在过去的几个小时里尝试过所有的东西。。。实际上是最近几天。我现在很生气。好吧，无论如何。我只是求助。

简单的任务。单击按钮可更改对象的位置。（我希望实际上能够点击一个按钮然后将所有列表项分散到关于页面的列表中......但是我觉得一旦我弄清楚如何完成这个简单的任务，我可以从那里弄清楚。

老实说我已经尝试过一切，我在网上看到的每一个代码变体。我不知道为什么它不适合我，但我认为一定是因为我弄乱了语法。

<p> I want to move this text </p>
<input type = "button" value = "Click me">

<script type = "text/javascript" src = "js/jquery.js"></script>

<script type = "text/javascript">
    $(':button').click(function() { 
    $('p').css({backgroundPosition: '100px 0px'});
});
</script>

我尝试去除花括号。我尝试了其他变体，包括：

<script type = "text/javascript">
$(':button').click(function() { 
$('p').css('backgroundPosition', '-100px 0px');
});
</script>

无数小时在这里和其他地方寻找解决这个简单的问题。

我想要的只是f'ing语法。我可以很容易地改变背景颜色，但是位置有两个坐标要改变，我不知道为什么我尝试过的东西都没有。

感谢您的帮助。

Answer 1

该错误不在您的jQuery中，该代码是正确的。问题似乎出现在您的css属性中。请考虑以下代码变体。

$(':button').click(function() { 
    $('p').css({'background-color': 'blue'});
});

这里我改变了CSS以更新背景颜色与位置。这很好用，并在以下小提琴演示

小提琴：http://jsfiddle.net/7TuVx/

我会直接将CSS应用于p对象，看看你需要将它移动到正确的位置，然后相应地更新你的jQuery代码

Answer 2

<script type = "text/javascript">
    $(':button').click(function() { 
        $('p').css('background-position', '-100px 0px');
    });
</script>

你拼错了css属性。

Answer 3

backgroundPosition指的是图像集作为元素背景的位置。更改不会移动<p>标记。要移动元素，您应该修改left和top，但您还需要将position设置为相对或绝对。

如何在单击按钮时更改元素的背景位置

3 个答案: