Форум программистов, компьютерный форум, киберфорум
Наши страницы
jQuery
Войти
Регистрация
Восстановить пароль
Другие темы раздела
jQuery Глобальные переменные JavaScript http://www.cyberforum.ru/javascript-jquery/thread1436339.html
Всем привет, вопрос такого характера, подключил к своему сайту корзину, она на jquery-1.11.0.min, а до этого для всякой визуализации использовал jquery-1.5.1.min, получилась несовместимость, с ней я...
jQuery Undefined при выводе mediaUrl
Здравствуйте. Вот есть: <div class="block"> <a class="listen_href" title="«Lethal Bizzle -Дабстеп»" alt="«Lethal Bizzle -Дабстеп» " data-artist="Lethal Bizzle"...
Js + AJAX + абсолютный и относительный путь к файлу jQuery
Всем привет ^_^ Сразу пример для лучшего понимания: http://example.com/page/NewPage.php Если я хочу обновить <div id="content"></div> на главной странице ( example.com/index.php ), то код работает...
jQuery UI draggable: удаление div при постоянном перетаскивании одного контейнера. Здравствуйте , подскажите пожалуйста почему неправильно выполняется вот такой код? есть массив объектов segmentsCoords из которого я методом splice при старте драга вырезаю один элемент и помещаю его... http://www.cyberforum.ru/javascript-jquery/thread1436273.html
jQuery Вывод опросника http://www.cyberforum.ru/javascript-jquery/thread1436178.html
Помогите с выводом опросника не алертом, а на страницу в div <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!-- saved...
Выбор нескольких позиций из второго select jQuery
Здравствуйте, господа! Судьба поставила перед телом задачу: Есть два select. В первом области, во втором - города этих областей. Сделал подтяжку во второй select соответствующих областей, но есть...
Удаление товара из корзины jQuery
Удаляю, товар, а после без перезагрузки обновляю корзину, вот только у меня ничего не выводится function delProduct(obj) { var frm = $('#' + obj); var data_string = frm.serialize(); ...
jQuery Как написать цикл в скрипте <script type="text/javascript"> $(document).ready(function(){ $('#add_ingredient').click(function(){ $("tr:last").after("<tr id='ingredient'"); }); }); </script> Как сделать... http://www.cyberforum.ru/javascript-jquery/thread1435965.html
jQuery При наведении курсора на один блок, плавно выпадает другой http://www.cyberforum.ru/javascript-jquery/thread1435897.html
Грубо говоря я немного запутался с jQuery. Начал изучать не так давно. Прошу вас помочь мне разобраться. Ну вот например у меня есть: HTML <div id="header_b"> <div...
jQuery Вывод модального окна при нажатии на button Добрый день. Есть модальное окно, в котором расположена форма. При заполнении формы и нажатии на кнопку "отправить" страница перегружается, а нужно вывести "спасибо за обращение". Делал разными... http://www.cyberforum.ru/javascript-jquery/thread1435843.html
Octaus
0 / 0 / 0
Регистрация: 03.05.2015
Сообщений: 4
03.05.2015, 12:07  [ТС] 0

Меню со слайдером на jQuery

03.05.2015, 12:07. Просмотров 330. Ответов 6
Метки (Все метки)

Ответ

Цитата Сообщение от Lazy_Den Посмотреть сообщение
P.S. Вот вам пара примеров, как можно сделать без сторонних плагинов:
Вариант первый. Пути к изображениям привязываем атрибутом data-* к каждой ссылке меню.
Кликните здесь для просмотра всего текста
HTML5
1
2
3
4
5
6
7
8
<ul class="slide_nav">
    <li><a href="" data-img="http://lorempixel.com/200/200/sports/1/">Slide 1</a></li>
    <li><a href="" data-img="http://lorempixel.com/200/200/sports/2/">Slide 2</a></li>
    <li><a href="" data-img="http://lorempixel.com/200/200/sports/3/">Slide 3</a></li>
</ul>
<div class="slide_output">
    <img src="" alt="" />
</div>
Javascript
1
2
3
4
5
6
7
var slideLink = $('.slide_nav a'),
    outputImg = $('.slide_output img');
slideLink.on('click', changeSlide).eq(0).click();
function changeSlide(e){
    e.preventDefault();
    outputImg.attr('src', $(this).data('img'));
}
Вариант второй. Связываем изображения и ссылки по индексу.
Кликните здесь для просмотра всего текста
HTML5
1
2
3
4
5
6
7
8
9
10
<ul class="slide_nav">
    <li><a href="">Slide 1</a></li>
    <li><a href="">Slide 2</a></li>
    <li><a href="">Slide 3</a></li>
</ul>
<div class="slide_output">
    <img src="http://lorempixel.com/200/200/sports/1/" alt="" />
    <img src="http://lorempixel.com/200/200/sports/2/" alt="" />
    <img src="http://lorempixel.com/200/200/sports/3/" alt="" />
</div>
Javascript
1
2
3
4
5
6
7
8
var slideLink = $('.slide_nav a'),
    outputImg = $('.slide_output img');
outputImg.eq(0).addClass('active');
slideLink.on('click', function(e){
    e.preventDefault();
    outputImg.removeClass('active');
    outputImg.eq($(this).index('.slide_nav a')).addClass('active');
});
Спасибо за ответ. А можно ли в этот слайдер http://www.jssor.com/demos/tab-slider.html вставить что-то вроде меню вместо превьюшек слева?

Вернуться к обсуждению:
Меню со слайдером на jQuery
0
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
03.05.2015, 12:07

Консультация по меню на jQuery
Здравствуйте, уважаемые Форумчане! В поиске сейчас разобраться сложно, по этому не нашел подходящую...

Навигационное меню Jquery
Добрый день, уважаемые форумчане! Третий день не могу подключить навигационное меню, как тут...

Выпадающее меню на JQuery
Ребята, чувствую себя идиотом, но уже перестал что-либо понимать. Есть такой простенький...

0
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.
Рейтинг@Mail.ru