javascript - 在jquery中选择背景图像“ONLY”的方法？

Question

我在 jQuery 中设置为“仅”在背景图像上提供 scale 属性，但 div 自身不断变大。像这样：

这就是我在 jQuery 和 HTML 中设置的方式。

var bg = $('.news_box_long').css('background-image', 'img/img_09.jpg')
  $('.news_box_long').mouseenter(function(){
    if(!$(bg).is(':animated')) {
      $(this).css({'transform': 'scale('+ 1.1 +')'})
    }
})

<div class="news_box_long background" style="background-image: url(img/img_09.jpg)">
</div>

标签： javascriptjqueryhtmlcssselect

Answer 1

你不需要 jQuery。CSS就足够了

.news_box_long {
  height: 200px;
}

.background {
  background: 50% 50%/100% none no-repeat;
  transition: background 0.5s;
}

.background:hover {
  background-size: 150%;
}

<div class="news_box_long background" style="background-image:url(https://i.pinimg.com/originals/9f/1f/f5/9f1ff5f730db75ce458ee2890b8e6197.jpg)">
</div>