2

ブートストラップを学びたいと思い、airbnb.com html ファイルをいじり始めました。ctrl-s を実行してすべてのファイルを取得し、html ファイルを開いて編集しました。画像がシャッフルされる方法が好きなので、airbnb ファイルを取得しました (これをカルーセルと呼ぶことができますか?)

そこで、まずホームページに掲載する写真を変更しました。最初の画像が変わったのですが、驚いたことに、そうすると画像がシャッフルして止まります。右矢印をクリックしても (airbnb.com で確認できます)、画像が変わりません。

画像付きのコードは次のとおりです。画像のシャッフルなどに関連するものは何も表示されません:

<div id="hero" style="display:block;" data-native-currency="CAD" class="search_intro">
  <ul class="unstyled" id="slideshow">
      <li class="" data-slide-type="search_intro" data-bg-opacity="1" style="display: block;">
      <img alt="Maison pittoresque" src="./prototype_files/25681-86e324d87449b1f07afd358cc62bbbb8.jpg" height="700" width="1600">
        <div class="caption">
            <button class="wish_list_button not_saved heart btn gray large" data-hosting_id="25681" title="Enregistrez cette annonce pour plus tard." data-name="Maison pittoresque" data-address="Munster, France">
              <i class="icon icon-product-wishlist pink"></i>
            </button>
          <a href="https://fr.airbnb.ca/rooms/25681"><img alt="25681-3f7484e66def17ef287de5c686e497a2" height="40" src="./prototype_files/25681-3f7484e66def17ef287de5c686e497a2.jpg" width="40"></a>
          <p><strong><a href="https://fr.airbnb.ca/rooms/25681">Maison pittoresque</a></strong>
            <br><a href="https://fr.airbnb.ca/rooms/25681">Munster, France</a> -
                  <span class="price" data-price="80.0427">$83 CAD</span></p>
        </div>
      </li>
      <li data-slide-type="search_intro" data-bg-opacity="1" class="active">
      <img alt="Superbe villa sur la plage" height="700" width="1600" src="./prototype_files/387153-b6473710c2cb9ec734cb06bf9d90bdd8.jpg">
        <div class="caption" style="display: block;">
            <button class="wish_list_button not_saved heart btn gray large" data-hosting_id="387153" title="Enregistrez cette annonce pour plus tard." data-name="Superbe villa sur la plage" data-address="Bali, Indonésie">
              <i class="icon icon-product-wishlist pink"></i>
            </button>
          <a href="https://fr.airbnb.ca/rooms/387153"><img alt="387153-098c2c9ac018937ef05a8b7079c4149e" height="40" src="./prototype_files/387153-098c2c9ac018937ef05a8b7079c4149e.jpg" width="40"></a>
          <p><strong><a href="https://fr.airbnb.ca/rooms/387153">Superbe villa sur la plage</a></strong>
            <br><a href="https://fr.airbnb.ca/rooms/387153">Bali, Indonésie</a> -
                  <span class="price" data-price="171.0">$177 CAD</span></p>
        </div>
      </li>
      <li data-slide-type="search_intro" data-bg-opacity="1">
      <img alt="Cabane d&#39;intérieur en Allemagne" height="700" width="1600" src="./prototype_files/511605-333786588d7d46abb7949afeb3dbddfb.jpg">
        <div class="caption">
            <button class="wish_list_button not_saved heart btn gray large" data-hosting_id="511605" title="Enregistrez cette annonce pour plus tard." data-name="Cabane d&#39;intérieur en Allemagne" data-address="Constance, Allemagne">
              <i class="icon icon-product-wishlist pink"></i>
            </button>
          <a href="https://fr.airbnb.ca/rooms/511605"><img alt="511605-3b6430731c0469cb219253433f5f975d" height="40" src="./prototype_files/511605-3b6430731c0469cb219253433f5f975d.jpg" width="40"></a>
          <p><strong><a href="https://fr.airbnb.ca/rooms/511605">Cabane d'intérieur en Allemagne</a></strong>
            <br><a href="https://fr.airbnb.ca/rooms/511605">Constance, Allemagne</a> -
                  <span class="price" data-price="85.3789">$88 CAD</span></p>
        </div>
      </li>
  </ul>

ブートストラップ Web サイトのカルーセル デモも試しましたが、好きではありません。そう、私の質問は:

airbnb.com カルーセル スタイルを行うには?

ありがとうございました

4

1 に答える 1

-2

優れたスライダーをお探しの場合は、スキッター スライダーを使用してください。カスタム性も高いです。

于 2013-08-19T00:12:25.437 に答える