Показывает код, который скрывает слайды фотографии и т.д. при нажатии кнопки. Вы можете найти сайт, который я создаю здесь www.samuelbradley.com
$(document).ready(function(){
hidden = true;
$(".btn-slide").click(function () {
if(hidden == false) {
$("#slideshow").slideDown('3000, linear, callback');
$("#thumbs").slideUp('3000, linear, callback');
hidden = true;
} else {
$("#slideshow").slideUp('3000, linear, callback');
$("#thumbs").slideDown('3000, linear, callback');
hidden = false;
}
});
});
$(document).ready(function(){
hidden = true;
$(".thumb").click(function () {
if(hidden == false) {
$("#slideshow").slideDown('3000, linear, callback');
$("#thumbs").slideUp('3000, linear, callback');
hidden = true;
} else {
$("#slideshow").slideUp('3000, linear, callback');
$("#thumbs").slideDown('3000, linear, callback');
hidden = false;
}
});
});
Этот код показывает основной HTML-код, который содержит список миниатюр и т. Д.
<div id="thumbnail-image"><a href="#" ><img src="images/thumbnail.jpg" alt="thumanil- image" title="Thumbnail View for Samuel Bradley" width="40" border="0" class="btn-slide" /></a>
</div><!--end of thumbnail image-->
</div><!--end of header-->
<div id="controlholder">
<div id="controls"></div>
</div>
<div id="slideshow">
</div>
<div id="thumbs">
<ul class="thumbs noscript">
<li><a href="images/archive/live-tour/1_noelfielding.jpg" title="Samuel Bradley Photography" class="thumb"><img src="images/thumbnail/LIVE-TOUR_T/1 NOEL FIEDLING_THE BIG CHILL_thumb" width="185" alt="Samuel Bradley" border="0"/></a></li>
<li><a href="images/archive/live-tour/2_noelfielding.jpg" class="thumb"><img src="images/thumbnail/LIVE-TOUR_T/2_NOEL FIELDING, THE BIG CHILL_thumb" width="185" alt="Samuel Bradley" border="0"/></a></li>
<li><a href="images/archive/live-tour/3_dylanmoran.jpg" class="thumb"><img src="images/thumbnail/LIVE-TOUR_T/3_DYLAN MORAN_THE BIG CHILL_thumb" width="185" alt="Samuel Bradley" border="0"/></a></li>
<li><a href="images/archive/live-tour/4_youmeatsix.jpg" class="thumb"><img src="images/thumbnail/LIVE-TOUR_T/4_YOU ME AT SIX, HOLD ME DOWN TOUR_thumb" width="185" alt="Samuel Bradley" border="0"/></a></li>
Большие изображения загружаются в div #slideshow, который показывает и легко скрывает, однако я не могу скрыть тег thumbs? Даже когда я установил отображение #thumbs div, оно все равно не отображается.
Я просто хочу, чтобы большое изображение отображалось при загрузке страницы, а затем с помощью превью thumbs для переключения между полным просмотром и просмотром миниатюр, но я не хочу видеть эскизы и большое изображение одновременно.
Любая помощь приветствуется. Надеюсь, я объяснил и показал достаточно примеров?
Софи