Два вопроса

Привет всем!

Сразу к вопросам:

1. Как сделать такой же спойлер как и тут на сайте «Интересные расширения из каталога», с кнопкой показать/скрыть и что бы запоминало и не открывалось все время при каждой перезагурзке стр.

2. Кто работал тестно с модальными окнами ЛС, нужно их сделать что бы бегунок прокручивал само окошко вниз/верх а не сайт который на фоне.

Спасибо.

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

avatar
1. Открываем любой блог. На его странице есть О блоге. Смотрим как реализовано в шаблоне. Делам блок и вставляем его в нужное место.
2. Вроде никак, js который отвечает за работу такой. Но вроде на githab'e livestreet, уже есть замена таким модальным окнам.
avatar
можете показать пунк 2?
avatar
avatar
2. Не совсем понятно, что имеется ввиду. Модальное окно должно быть зафиксировано относительно бэкграунда или зафиксировано относительно окна браузера? Или контент внутри модального окна должен прокручиваться? Все это можно сделать через стили.
avatar
Если я правильно понял вот это:
… что бы бегунок прокручивал само окошко вниз/верх а не сайт который на фоне
То человеку нужно вот такое: Bootstrap Scroll Modal
Но тут, ответ один:
Вроде никак...
avatar
Стили и немного магии. По клику бэграунд overflow hidden, контейнер с модальным окном position fixed, overflow-x scroll. Что происходит: отключаем скролл у бэкграунда и включаем скролл у контейнера с модальным окном. js нужен для смены стилей.
avatar
О стилях знаю, их и ковырял но пока не получилось, нужно именно что бы скрол был в браузере при прокрутке окна вниз/верх а не в самом окошке, нужно так как тут и то там два скрола почему то
avatar
и то там два скрола почему то
Где?
avatar
ПО ССЫЛКЕ «ТУТ»
avatar
Не надо «капслуков» — у меня там один scroll. Поэтому и переспросил.
avatar
капслук был случаен :) я адекватен
avatar
Открываем режим разработчика в браузере, на этой странице вставляем перед тегом body это.
И в стили body добавляем overflow: hidden. Вот и все.
avatar
<div style="width: 100%; height:100%; position: fixed; overflow-x: scroll; top: 0; left: 0; background-color: gray; opacity: 0.5;z-index: 9999;"><div style="margin: 200px auto; width: 400px; height: 1600px; background-color: green"></div></div>
avatar
не совсем понятны эти два дива и куда их вставлять
avatar
Тут пример без привязки к плагинам: jsfiddle.net/kompi/Xtr3V/
avatar
Точнее вот — эта версия рабочая: jsfiddle.net/Xtr3V/1/
В той, после закрытия модального окна состояние основного контейнера не возвращается в исходнкю.
avatar
не получается, играюсь с overflow и ничего ен меняется, или есть ползунок или нету но всегд ана фоне, даже когад прописываю что бы не показывался в стиле фона а показывался в стиле окна
avatar
1. Открываем любой блог. На его странице есть О блоге. Смотрим как реализовано в шаблоне. Делам блок и вставляем его в нужное место.

как я вижу там запоминалки нету, а здесь если нажмем скрыть он остается скрытым и мы гулям по страницам с скрытым спойлером.
avatar
Смотрите тамошний код:

    jQuery(function() {
        var $features = $('#ls-catalog-addons-features'),
                $close = $('#ls-catalog-addons-features-close'),
                cookieName = 'ls_addons_features_frame',
                closedClass = 'closed';

        if ( $.cookie(cookieName) ) hide();

        function hide() {
            $.cookie(cookieName, 1, { 'path': '/' });
            $features.addClass(closedClass);
            $close.text('Показать');
        };

        $close.on('click', function (e) {
            if ( ! $features.hasClass(closedClass) ) {
                hide();
            } else {
                $.cookie(cookieName, null, { 'path': '/' });
                $features.removeClass(closedClass);
                $close.text('Свернуть');
            }

            e.preventDefault();
        });
    });

Просто состояние записывается в куку
avatar
о! спасибо! как я понимаю этот скрипт и пару дивов покажут мне чудо?
avatar
да по сути вам надо поменять только:
var $features = $('#ls-catalog-addons-features'),
    $close = $('#ls-catalog-addons-features-close'),
    cookieName = 'ls_addons_features_frame',
    closedClass = 'closed';
avatar
так и ен получтлсь с окнами, игрался стилями пол дня пол ночи, кто может помочь?
avatar
break , ещё в самом начале было сказано, что с базовыми окнами актуальной версии LS ничего не получится. Нужно либо ждать (рекомендуется), либо брать стороннее решение и прикручивать (+ смотря что Вам нужно). Как пример (кликать по фото): окна с прокруткой. Использовано это в связке с Bootstrap.
avatar
получится елси через стили, поигратся overflow нужно но я не совсем компитентен в этом по этому прошу помощи
avatar
Бог в помощь.
avatar
Очень умный коментарий .)
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.