このチュートリアルでカルーセル画像を作成しました。最初の画像を大きくしたいので、次をクリックすると次の画像が大きなdivに表示され、画像をクリックすると画像が大きなdivに表示されます。このようなことを試しました
$("bigimage_container").ready(function() {
document.getElementById("bigimage_container").style.background = 'url('+ +') ';
document.getElementById("bigimage_container").style.backgroundPosition = "center center";
document.getElementById("bigimage_container").style.backgroundRepeat = "no-repeat";
document.getElementById("bigimage_container").style.backgroundSize = "100% 100%";
});
しかし、私の問題は、URLまたは最初の画像を取得する方法です。それから私はこれを思いつきました
$('#carousel_ul li:first').each(function() {
alert($(this).attr('src'))
});
しかし、アラートが表示されたら、未定義と表示されます。ヘルプがあれば、これを作成する方法を説明するか、チュートリアルを作成してください。このようなギャラリーの作成方法を知っている場合は、すばらしいでしょう。次のような画像ギャラリーを作成するアップルストアは本当にクールです。
更新：html
<div id="bigimage_container"></div>
<div id='carousel_container'>
<div id='left_scroll'><img src='left.png' /></div>
<div id='carousel_inner'>
<ul id='carousel_ul'>
<li><a href='#'><img src='1.png' /></a></li>
<li><a href='#'><img src='2.png' /></a></li>
<li><a href='#'><img src='3.png' /></a></li>
<li><a href='#'><img src='4.png' /></a></li>
<li><a href='#'><img src='5.png' /></a></li>
</ul>
</div>
<div id='right_scroll'><img src='right.png' /></div>
</div>
document.getElementById("bigimage_container").style.background = 'url('+$('#carousel_ul li:first img').attr("src") +') ';
document.getElementById("bigimage_container").style.backgroundPosition = "center center";
document.getElementById("bigimage_container").style.backgroundRepeat = "no-repeat";
document.getElementById("bigimage_container").style.backgroundSize = "100% 100%";
EhsanSajjad卿の答えに基づいて..それは私のために働いた
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加