单击图像以使用JQuery更改DIV中背景的位置

我试着自己建造这个，但就是不能让它工作

我想要实现的是一行图像，如果单击它们，它们只是移动div的背景位置

我不知道为什么我不能让这么简单的东西工作。这是HTML

<div class="target"></div>
<a href="#"><img src="01_thumb.jpg" class="thumb"></a><a href="#"><img src="02_thumb.jpg" class="thumb"></a><a href="#"><img src="03_thumb.jpg" class="thumb"></a>

您将获得单击的定位点（如果它们不是其父元素中的唯一元素，则进行调整）的if值，并将该值乘以以更改

。目标
的
背景位置，如下所示：

$("a:has(img.thumb)").click(function(e) {
  $(".target").css("background-position", -$(this).index()*240 + "px 0px");
  e.preventDefault(); //prevent navigating to the # href
});

，如果有许多
.item
元素，请使用
$（this）.最近的（“.item”）。查找（“.target”）
而不是
$（.target”）
，
你好，尼克，这不是我想要的，谢谢。我只需要在单击链接时移动div的背景位置。链接不在div内部或与之相关。@rage-链接在哪里？如果只有一个
，您只需用
$（.taget”）
替换
$（this）.closest（“a”）.prevAll（.taget:first”）
，以上内容仍然适用。另外，您提到了位置，但问题中没有涉及到它，
背景位置
是否确实受到影响？如果是这样，每个链接应该做什么？嗨，尼克，每个链接只是将.target的背景位置x移动240像素。链接1是0，然后是240，然后是480@rage-答案已更新，请查看这是否是您想要的。您可以将
.css（）
更改为
.animate（）
，以获得转换。
$("a:has(img.thumb)").click(function(e) {
  $(".target").css("background-position", -$(this).index()*240 + "px 0px");
  e.preventDefault(); //prevent navigating to the # href
});