Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Шаблоны (TPL) » Как реализовать кнопки переключения картинок как на softportal

Как реализовать кнопки переключения картинок как на softportal


     05.01.2014    Все вопросы » Шаблоны (TPL)    2942

вопрос
Здравствуйте, как реализовать кнопку(и) переключение картинок, как на софтпортале?
Как реализовать кнопки переключения картинок как на softportal

Ответил: ПафНутиЙ


Примерно вот так

JS:
jQuery(document).ready(function($) {
    $(document).on('click', '.selector', function(event) {
        event.preventDefault();
        $('html').removeClass('class1 class2 class3').addClass($(this).data('class'));
        $(this).addClass('active').siblings().removeClass('active')
    });
});

HTML:
<span class="selector" data-class="class1">class1</span>
<span class="selector" data-class="class2">class2</span>
<span class="selector" data-class="class3">class3</span>

10 комментариев

teleoperator27
Юзер

teleoperator27 - 5 января 2014 10:31 -

ну либо через JS присваивать разные классы body с соответствующими стилями, либо насандалить несколько шаблонов с разным фоном и кнопки переключения это просто ссылки на шаблон, примерно по аналогии как делается два языка на сайте

вАСЯ
Юзер

вАСЯ - 5 января 2014 11:35 -

можно поподробнее с 1-м вариантом через JS?

nambo1
Юзер

nambo1 - 5 января 2014 12:13 -

Если ты про эти вкладки, то могу дать свои (на jquery)

nambo1
Юзер

nambo1 - 5 января 2014 12:32 -

Так более симпатично

teleoperator27
Юзер

teleoperator27 - 5 января 2014 14:42 -

да при чем тут табы? здесь нужна замена класса body по нажатию. Готового варианта нет, увы, но по этому вопросу в инете много инфы. Время будет если то накидаю

teleoperator27
Юзер

teleoperator27 - 5 января 2014 15:03 -

для примера
<script> 
            $(document).ready(
                function() {
                    $("a.my-meny").click( function() { // назначаем реакцию на событие всем ссылкам с классом my-meny
                            $("a.my-meny").removeClass("act"); // при клике удаляем класс act из всех ссылок меню
                            $(this).addClass("act"); // добавляем в нажатую ссылку класс act
                        }
                     );  
                }
            );


</script>
по аналогии сделать для body class="бла бла "> Только не забывайте, что этого мало, еще и куки потеребить придеться, что бы у юзера выбор запомнился :)

nambo1
Юзер

nambo1 - 5 января 2014 15:33 -

на табах это всё проще

teleoperator27
Юзер

teleoperator27 - 5 января 2014 16:27 -

Цитата: nambo1
на табах это всё проще
шо за бред ))) вы хоть понимаете принцип работы табов?

nambo1
Юзер

nambo1 - 5 января 2014 16:56 -

teleoperator27,
да понимаю, и аргументирую то, что на табах это будет проще реализовать (лично для меня)

teleoperator27
Юзер

teleoperator27 - 5 января 2014 17:12 -

Цитата: nambo1
nambo1
то есть если на сайте планируется 8 цветов бэка, то главную страницу придется грузить 8 раз, только в 7 из них будет display:none; Вы перед тем, как советы давать, хотя бы интернет почитайте.

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх