Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 16.08.2010, 11:52   #1
BloodWizard
Пользователь
 
Аватар для BloodWizard
 
Регистрация: 23.10.2008
Сообщений: 46
По умолчанию Кнопки навигации галереи

В JS новичок!
Делаю галерею на сайт при помощи jquery!
сделал просто открытие картинки на странице но теперь нужны кнопки навигации... и не помешали бы эффекты перехода между картинками по нажатию на привюшку...
код страницы
Код HTML:
<h2>Illustrations</h2>

<p><img id="largeImg" src="images/img1-lg.jpg" alt="Large image" /></p>
<div id="id" class="thumbs" style="display:inline-block;">
<a id="btn_prev" name="back" href="images/" title="Image 2"><img border="0" id="btn" src="Back.jpg" /></a>
<div>
<a href=images/img1-lg.jpg title='Image 2'><img src=images/img1-lg.jpg /></a><a href=images/img2-lg.jpg title='Image 2'><img src=images/img2-lg.jpg /></a><a href=images/img3-lg.jpg title='Image 2'><img src=images/img3-lg.jpg /></a><a href=images/img4-lg.jpg title='Image 2'><img src=images/img4-lg.jpg /></a><a href=images/img5-lg.jpg title='Image 2'><img src=images/img5-lg.jpg /></a><a href=images/img6-lg.jpg title='Image 2'><img src=images/img6-lg.jpg /></a></div>
<a id="btn_next" name="next" href="images/img2-lg.jpg" title="Image 3"><img border="0" id="btn" src="Next.jpg" /></a>    
</div>
Код скрипта что сделал:
Код:
<script type="text/javascript">
$(document).ready(function(){
    $("h2").append('<em></em>')
    $(".thumbs a").click(function(){
        var largePath = $(this).attr("href");
        var largeAlt = $(this).attr("title");
		var nextImg = $(this).next().attr("href");
		var prevImg = $(this).prev().attr("href");
		$("#btn_next").attr({ href: nextImg});
		$("#btn_prev").attr({ href: prevImg});
        $("#largeImg").attr({ src: largePath, alt: largeAlt });
        $("h2 em").html(" (" + largeAlt + ")"); return false;
    });
 });
BloodWizard вне форума Ответить с цитированием
Старый 16.08.2010, 11:53   #2
BloodWizard
Пользователь
 
Аватар для BloodWizard
 
Регистрация: 23.10.2008
Сообщений: 46
По умолчанию

Попробовал добавить вот эту функцию для кнопки перехода на следующую картинку:
Код:
	$("#btn_next").click(function(){
		var largePath = $(this).attr("href");
        var largeAlt = $(this).attr("title");
		$("#largeImg").attr({ src: largePath, alt: largeAlt });
		$("h2 em").html(" (" + largeAlt + ")");
		var nextImg = $(".thumbs a").next().attr("href");
		var prevImg = $(".thumbs a").prev().attr("href");
		$("#btn_next").attr({ href: nextImg});
		$("#btn_prev").attr({ href: prevImg});
        return false;
	})
но переход происходит только раз.
BloodWizard вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц



Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как убрать с экрана системные кнопки навигации по записям? Skolot Microsoft Office Access 10 22.05.2012 23:16
Отчёт в виде галереи!!?? mmontana Microsoft Office Access 11 27.09.2009 14:16
Помощь в навигации (Дельфи) Grisha248 Помощь студентам 1 23.06.2009 12:35
Язык программирования программ навигации Diabler Свободное общение 0 05.03.2009 13:23
удаленная работа по модификации форума и галереи Hof Фриланс 4 22.02.2008 16:04