jQuery背景图像更改

Posted

技术标签:

【中文标题】jQuery背景图像更改【英文标题】:jquery background-image change 【发布时间】:2016-01-09 03:15:21 【问题描述】:

我想将图像加载到我的 html 上的 div 中,但它不起作用,如果我将 var image = $("#slider") 更改为 $("body") 它可以工作,但是整个身体淡入淡出,这不是我想要的。

我猜标识符有问题?

    $(document).ready(function()
    var count = 0;
    var images = ["/mvc_tut/views/index/images/bg1.jpg","/mvc_tut/views/index/images/bg2.jpg","/mvc_tut/views/index/images/bg3.jpg","/mvc_tut/views/index/images/bg4.jpg"];
    var image = $("body");

    image.css("background-image","url("+images[0]+")");

    setInterval(function()
      image.fadeOut(1000, function()
        image.css("background-image","url("+images[count++]+")");
        image.fadeIn(1000);
      );
      if(count == images.length)
      
        count=0;
      
    ,3000);
);

这就是html

<div class="container">
  <div id="#slider">
  <div class="row">
    <div class="col-md-6 homeleft">
    </div>
    <div class="col-md-3 col-md-offset-2">
      <div class="login">
        <form action="index/login" method="POST">
          <input type="text" class="form-control" name="userLogin" placeholder="Nutzername">
          <input type="password" class="form-control" name="passwortLogin" placeholder="Passwort">
          <button type="submit" class="btn btn-default">Anmelden</button>
        </form>
      </div>
      <div class="register">
        <form action="index/register" method="POST">
          <input type="text" class="form-control" name="userReg" placeholder="Nutzername">
          <input type="text" class="form-control" name="emailReg" placeholder="Email">
          <input type="password" class="form-control" name="passwortReg" placeholder="Passwort">
          <button type="sumbit" class="btn btn-default">Registrieren</button>
        </form>
      </div>
    </div>
  </div>
</div>
</div>

【问题讨论】:

【参考方案1】:

问题出在这里:

<div id="#slider">
<!-------^ // Please remove the #

HTML 元素不应有以# 开头的id。此外,从文档中:

IDNAME 标记必须以字母 ([A-Za-z]) 开头,后跟任意数量的字母、数字 ([0-9])、连字符 ("-")、下划线 ("_")、冒号 (":") 和句号(".")

【讨论】:

天哪,我是个盲人,感谢您帮助我,有时我会犯一些实际上相当大的小错误......【参考方案2】:

我看到你有 “#滑块” 在 id 值中。 你不应该在那里有一个'#'。 '#' 仅由 jQuery 用于标识 id 上的选择。

【讨论】:

以上是关于jQuery背景图像更改的主要内容,如果未能解决你的问题,请参考以下文章

jQuery背景图像更改

通过 Jquery 仅更改背景图像的 y 位置

使用 jQuery 更改多个背景图像

如何在 Rails 中从 JQuery 更改 CSS(背景图像)?

鼠标摇动时jQuery可拖动背景图像更改

无法在 jQuery 中更改 div 的背景图像