Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Другие темы раздела
jQuery Глобальные переменные JavaScript https://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 при старте драга вырезаю один элемент и помещаю его... https://www.cyberforum.ru/ javascript-jquery/ thread1436273.html
jQuery Вывод опросника https://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> Как сделать... https://www.cyberforum.ru/ javascript-jquery/ thread1435965.html
jQuery При наведении курсора на один блок, плавно выпадает другой https://www.cyberforum.ru/ javascript-jquery/ thread1435897.html
Грубо говоря я немного запутался с jQuery. Начал изучать не так давно. Прошу вас помочь мне разобраться. Ну вот например у меня есть: HTML <div id="header_b"> <div...
jQuery Вывод модального окна при нажатии на button Добрый день. Есть модальное окно, в котором расположена форма. При заполнении формы и нажатии на кнопку "отправить" страница перегружается, а нужно вывести "спасибо за обращение". Делал разными... https://www.cyberforum.ru/ javascript-jquery/ thread1435843.html
0 / 0 / 0
Регистрация: 03.05.2015
Сообщений: 4
03.05.2015, 12:07  [ТС] 0

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

03.05.2015, 12:07. Просмотров 358. Ответов 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
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
03.05.2015, 12:07

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь.

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

Мега меню на Jquery
Всем привет думаю быть может поможете с отличным вопросом.Дело в том что у меня на странице здесь...

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

трабл в меню на jQuery
есть такое меню: http://playground.adambecker.info/sweet-menu/ ну почти такое, текст и картинки...

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