时间戳

首页 > 解决方案 > 如何添加背景图像和线性渐变 Jquery？

javascript - 如何添加背景图像和线性渐变 Jquery？

问题描述

我想通过 JQuery 添加下面的背景图像 css 属性，图像的链接和线性渐变。即使只是链接对我不起作用

.product-video-container {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../Images/chicago.jpg");
}

我的尝试是这样的：

$(document).ready(function () {

  $(".product-video-section .product-video-container").each(function () {
    var _self = this;
    $('.product-video-container',_self).css('background-image', './Images/chicago.jpg')
  });
})

标签： javascriptjqueryhtmlcss

解决方案

这段代码：

$('.product-video-container', this).css...

相当于：

$(this).find('.product-video-container').css...

ie 寻找.product-video-container的后代this-this已经是 a.product-video-container这意味着您的 html 需要：

<div class='product-video-section'>
  <div class='product-video-container'>
    <div class='product-video-container'>
    </div>
  </div>
</div>

这似乎不太可能。

假设你有：

<div class='product-video-section'>
  <div class='product-video-container'>
  </div>
</div>

保留在应用程序其他地方使用的.eachand （不相关的代码，但与 OP 相关），您可以使用：_self

$(document).ready(function () {
  $(".product-video-section .product-video-container").each(function () {
    var _self = this;
    $(_self).css('background-image', '../Images/chicago.jpg')
  });
})

（也改为路径../Images/）

推荐阅读