Question

我在Vegas滑块（http://vegas.jaysalvat.com/）中遇到了一个问题。

我想将滑块添加为此黑色背景。

HTML code：

<div class="ui inverted vertical masthead center aligned segment" id="slider1">
  <div class="ui container">
    <div class="ui large secondary inverted pointing menu" style="border-style: none;">
      <a class="toc item">
        <i class="sidebar icon"></i>
      </a>
      <a class="active item">Home</a>
      <a class="item" href="patron.php">Parton</a>
      <a class="item" href="insygnia.php">Insygnia</a>
      <a class="item" href="historia.php">Historia  szkoły</a>
      <a class="item" href="dokumenty.php">Dokumenty</a>
      <a class="item" href="matura.php">Matura</a>
      <a class="item" href="strony.php">Strony  WWW</a>
      <a class="item" href="galeria.php">Galeria</a>
      <a class="item" href="kontakt.php">Kontakt</a>
    </div>
  </div>
  <div class="ui text container">
    <h1 class="ui inverted header">
      Życie jest długie, jeżeli się umie z niego korzystać.
    </h1>
    <h2>
      Senega
    </h2>
  </div>
</div>

要粘贴的基本Vegas脚本：

$("#example, body").vegas({
  slides: [
    { src: "/img/slide1.jpg" },
    { src: "/img/slide2.jpg" },
    { src: "/img/slide3.jpg" },
    { src: "/img/slide4.jpg" }
]});

愿任何人帮我实现这个脚本到html吗？我不是一个典型的程序员，我不懂JS语言。

谢谢。

Answer 1

只需将#example更改为#slider1即可与容器ID匹配，并将src值替换为指向您网站上的图片。以下是我在浏览器控制台中测试您网站的示例：

$("#slider1, body").vegas({
  slides: [
    { src: "http://i.imgur.com/Kf2zBCB.jpg" },
    { src: "http://i.imgur.com/OtjnTqO.jpg" },
    { src: "http://i.imgur.com/Sd44gRr.jpgg" },
    { src: "http://i.imgur.com/MXVqtDe.jpg" }
]});

当然，用你自己的图像替换它们。

添加维加斯滑块到div背景

1 个答案: