Форум программистов, компьютерный форум, киберфорум
Наши страницы
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
Lazy_Den
3043 / 2684 / 1355
Регистрация: 15.01.2014
Сообщений: 5,917
03.05.2015, 11:55 0

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

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

Ответ

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');
});


Вернуться к обсуждению:
Меню со слайдером на jQuery
0
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
03.05.2015, 11:55
Готовые ответы и решения:

Выпадающее меню перекрывается слайдером контента
День добрый, начал разбирать bootsrap 3 и наткнулся на проблему... Вообщем есть выпадающее меню, а...

Меню jquery
Добрый, Задача: - при загрузке старницы меню должно свернуться через 10с. - Если на меню фокус...

Меню на jquery 1.3.2
Нашёл симпотичное меню...

jQuery меню и Joomla
Доброго всем времени суток! Как я понимаю, меню jQuery, а именно создание его пунктов и...

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

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