画像を移動できる次の HTML コードがあります。
<div id="templatemo_slider">
<!-- This is the container for the carousel. -->
<div id = "carousel1" style="width:960px; height:280px;background:none;overflow:scroll; margin-top: 20px">
<!-- All images with class of "cloudcarousel" will be turned into carousel items -->
<!-- You can place links around these images -->
<a href="http://www.templatemo.com/page/1" rel="lightbox"><img class="cloudcarousel" src="images/slider/02.jpg" alt="CSS Templates 2" title="Website Templates 2" /></a>
<a href="http://www.templatemo.com/page/2" rel="lightbox"><img class="cloudcarousel" src="images/slider/02.jpg" alt="CSS Templates 2" title="Website Templates 2" /></a>
<a href="http://www.templatemo.com/page/3" rel="lightbox"><img class="cloudcarousel" src="images/slider/03.jpg" alt="CSS Templates 3" title="Website Templates 3" /></a>
<a href="http://www.templatemo.com/page/4" rel="lightbox"><img class="cloudcarousel" src="images/slider/04.jpg" alt="CSS Templates 4" title="Website Templates 4" /></a>
<a href="http://www.flashmo.com/page/1" rel="lightbox"><img class="cloudcarousel" src="images/slider/05.jpg" alt="Flash Templates 1" title="Flash Templates 1" /></a>
</div>
<!-- Define left and right buttons. -->
<center>
<input id="slider-left-but" type="button" value="" />
<input id="slider-right-but" type="button" value="" />
</center>
</div>
スクリーンショット リンクの実際の場合:
画像の代わりに Web ページを配置したい。
そのために私は使ってみました
<iframe class="cloudcarousel" src="http://www.bookmyshow.com" width = "800px" height ="1000px"></iframe></a>
画像は表示されますが、適切に配置されていません。iframe に幅を設定した後、フレームが左に移動し、ページ bookmyshow が不完全になります」
スクリーンショット リンク エラー: