Два способа, как сделать вертикальный и горизонтальный скролл div’а через jQuery и не только

« Предыдущая запись
 
  Следующая запись »
 

Иногда бывает просто необходимо сделать на странице блок, который бы имел свою полосу прокрутки. Конечно тут вспоминаются фреймы, но за то, что они давно уже отжили своё, они нам не подходят. Хотелось бы какое-нибудь решение, где обычному div'у можно было бы присобачить скролл. И такое решение есть, и не одно, а всё с использованием возможностей AJAX.

Вертикальный скролл с помощью jScrollPane

Общие слова

jScrollPane - это плагин к любимейшей библиотеке jQuery. Позволяет он приделывать вертикальный скролл div'у. Скролл можно конфигурировать по внешнему виду как угодно. На странице плагина (ссылка "инфо") можно найти различные способы его применения. Среди них выделю два: первый - в нём предложены основные способы и внешние виды скроллов, второй - показана реализация скроллинг в скроллинге, а также скроллинг всей странице как таковой. Скачать плагин можно с официального сайта, но можно и с моего в разделе загрузок

 

Маленькие хитрости

Плагин я использовал в практике несколько раз. Один из таких примеров можно видеть по ссылке. Внешний вид его нестандартен, что есть хорошо - можно лепить, всё что душе угодно (не душе, батенька, а заказчикам, заказчикам - прим.ред.).

Иногда плагин требует установки дополнительныйх плагинов, чтобы работало колёсико мыши для скролла и чтобы изменялся размер скроллинга в зависимости от количества контента. Но, как показала практика, всё работает и без них. Конечно, может у меня сборка плагина какая-то спешал, но вряд ли, качал с официального кажется.

 

Пример

Выше была предложена ссылка с примерами реализации. Тут я один из них разберу поподробнее и расскажу на что необходимо обратить внимание. Пример можно увидеть по ссылке и, при желании, скачать.

 

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

 

HTML-файл. Структура блока со скроллом следующая

<div class="vneshniy">
  <div id="vnutrenniy" class="scroll-pane">
    Контент
  </div>
</div>

Есть внешний div с классом, есть внутренний div с идентификатором и обязательным классом scroll-pane. Всё. Вызов функции производится следующим образом:

<script type="text/javascript">
    $(function()
    {
        $('#vnutrenniy).jScrollPane({showArrows:true, scrollbarWidth: 16, arrowSize: 16});
    });
</script>

При вызове указываются различные параметры, типа ширины скроллбара (scrollbarWidth), размера  его стрелочек (arrowSize) и так далее. Основные из них следующие:

  1. scrollbarWidth [число] - ширина скроллинга (по умолчанию 10)
  2. scrollbarMargin [число] - отступ слева от скроллбара (по умолчанию 5)
  3. wheelSpeed [число] - скорость колеса прокрутки в пикселах (по умолчанию 18)
  4. showArrows [логическое] - показывать графические стрелочки или нет (по умолчанию false)
  5. arrowSize [число] - высота стрелочки, если showArrows=true (рассчитывается через CSS, если не указана)
  6. dragMinHeight [число] - минимальная высотка бегунка (по умолчанию 0)
  7. dragMaxHeight [число] - максимальная высота бегунка (по умолчанию 99999!)
  8. scrollbarOnLeft [логическое] - если скроллбар нужен слева, ставим true.

 

Теперь откроем файл jscroll.css. Смотрим следующие строки.

  1. 6 строка. Ставим нулевой оутлайн на div'ы, иначе если в Фаерфоксе кликнуть по блоку, которому присобачен скролл, то он будет окантован пунктирной рамочкой. (Об этом читайте в статье Как убрать выделение ссылок пунктирной рамкой в FireFox)
  2. 8-15 строки. Внутреннему div'у ставим ширину и высоту (!), оверфлоу (не обязательный параметр кажется), паддинг скорее всего понадобится, остальное неважно.
  3. 17-19 строки. Внешний div. Вот ему ни в коем случае нельзя прописывать высоту, и обязательно нужно указывать float: left. Всё это делается с одной целью - чтобы Опера 10 нормально работала со скроллом. Если это не соблюсти, то скролл дива будет синхронен со скроллом браузера и в итоге получится полная чушь. Помните об этом.
  4. 23-57 строки. Стили картинок для скролла

Изменение остальных строк по идее не нужно.

 

Вертикальный и горизонтальный скролл на FleXcroll

Не так ознакомился с этим скриптом. Он идёт без использования jQuery, что является плюсом (не всегда ж jQuery нужен). Вторым плюсом будет то, что есть горизонтальный скролл. Третий плюс заключается в том, что в архиве с плагином приложены примеры использования, причём хорошие, разноплановые, за что большой респект.

С плагином на проектах работать не приходилось, но первое знакомство оказалось приятным. Единственный замеченный минус заключается в том, что при наведении мышкой курсор не превращается в "ручку". Мне кажется это минус, так как интуитивно непонятно может быть скролл это или нет. Однако, мне думается, через css всё исправить не будет проблем.

 

 

В завершении

Вертикальные и горизонтальные скроллы для div'ов не являются проблемой в реализации, всё просто и легко осуществимо. Поэтому дерзайте, используйте, открывайте новое. Всегда буду рад услышать комментарии, вопросы, пожелания=).

,

1 звезда2 звезд3 звезд4 звезд5 звезд (голосов: 12, средний: 4.50 из 5)
Понравилась статья или журнал? Подписывайся на продолжение!
Отзывов: 61 на запись

"Два способа, как сделать вертикальный и горизонтальный скролл div’а через jQuery и не только"

  1. О, то что надо! Давно искал плагины для кастомизации скролла, но никак руки не доходили

  2. Ю а велкам=)

  3. Единственный замеченный минус заключается в том, что при наведении мышкой курсор не превращается в “ручку”. Мне кажется это минус, так как интуитивно непонятно может быть скролл это или нет.

    Если интуитивно непонятно что это скролл – нафиг такой скролл?? Юзер разбираться не будет ;) Меня вот эта ‘ручка’ напрягает :(

    ЗЫ. в примере содержимое не скроллируется колесиком мышки – вот это БОЛЬШОЙ минус!

  4. Лично я флекскроллом не пользовался, но почти не сомневаюсь, что в CSS можно прописать нужным элементам cursor:pointer и дело в шляпе =)

    проверил все примеры, работает скролл, стал побраузерно проходить, наткнулся в Лисе, что не работает. Дело в том, что для скроллинга в некоторых браузерах нужен доп.плагин jQuery Mousewheel. Так что пример исправил. Спасибо за то, что заметили =)

  5. Дмитрий
    26/04/2010 at 17:11 Постоянная ссылка Цитировать

    Добрый День!

    Не подскажите возможно ли Скрполл сделать как браузере помощью DIV растянуть на все окно со скроллингом вашим, я молодой в CSS еще плохо понимаю в позиционирования 3 дня экспериментировал не чего не вышло то скролл пропадал то каша получалось использовал Ширину и Высоту в % и px

    мне интересно я такой долгий или это не возможно добиться в CSS?

    Заранее благодарю за ответ.

    С Уважением Дмитрий.

  6. приветствую!
    насколько понял вопрос, нужен обычный скролл средствами css? тогда надо контейнеру прописать размеры (высоту обязательно) и overflow: scroll. Всё

  7. Дмитрий
    26/04/2010 at 22:19 Постоянная ссылка Цитировать

    DIV
    {
    height: 98%; /* Высота блока */
    width: 99%; /* Ширина блока */
    overflow: auto; /* Добавляем полосы прокрутки */
    padding-left: 15px; /* Отступ от текста слева */
    background-attachment: fixed;
    background: #000000 /* Цвет фона */
    url(‘Fon-OPA-1.jpg’) /* Путь к фоновому изображению */
    no-repeat; /* Повторять фон по вертикали */
    }

    BODY { overflow: hidden;
    background-attachment: fixed;
    background-image: url(‘1.jpg’); /* Путь к фоновому изображению */
    }

    #layer {
    left: 0px; /* Положение от левого края */
    top: 0px; /* Положение от верхнего края */
    bottom: 0px; /* Расстояние от нижнего края окна браузера */
    position: absolute; /* Абсолютное позиционирование */
    padding: 7px; /* Поля вокруг текста */
    border: solid 0px black; /* Параметры рамки */
    }

  8. а можно как-нибудь пояснить, что именно хочется, а то описание полностью без предлогов, понимай как хочешь

  9. Дмитрий
    27/04/2010 at 0:25 Постоянная ссылка Цитировать

    Может иза того не получается что использую Google Chrome браузер?

  10. Александр Шуйский
    27/04/2010 at 0:29 Постоянная ссылка Цитировать

    что не получается то? пристроить джейскролл? или флексскролл?

    советую скачать пример по ссылке (типа через “Сохранить страницу”) и просто подгонять пример под свои нужды. иногда так проще, чем пытаться из одного примера строчки переносить в другой

  11. Дмитрий
    27/04/2010 at 0:45 Постоянная ссылка Цитировать

    Хотел сделать на своей страничке красивый скроллинг, со своим видом – нашел эту тему и долго бьюсь, но не получается заменить дизайн полосы прокрутки.
    Но мне не понять, это работает то ко в DIVe в самом BODY не работает? Я не знаю!.
    Скачал пример и пытался внедрить к себе на страницу, растянуть DVI до границ Браузере, что бы тот дизайн полосы которая в примере встала на то место той где расположен полоса самого браузера…
    вот над чем я бьюсь..
    Буду признателен тому кто пояснит как замостить полосу на сколлинг браузера.
    Заранее благодарю.

    С Уважением Дмитрий!

  12. Allexandriya
    27/09/2010 at 23:19 Постоянная ссылка Цитировать

    Доброго времени суток.
    Прежде всего хочу сказать спасибо за то, что ведете этот блог. Читаю уже пару дней. Хорошая подача информации.

    И тут же спросить: скачала ваш пример jScroll, все работает. Радует.
    Вопрос заключается вот в чем: в этом примере (как, наверное, везде) ползунок масштабируется взависимости от количества инфо в блоке.
    Возможно ли сделать так, чтобы ползунок не изменялся (не растягивался)?

    А использовалась зависимость длинны всей полосы прокрутки к длине блока?

    Заранее спасибо за ответ.

  13. Большое спасибо за отзыв!

    Да, можно! Не помню точно, как, но, если не ошибаюсь, там можно задавать минимальную и максимальную длину ползунка и в этом случае необходимо в качестве одного и другого параметра указать одно и то же число.

  14. Allexandriya
    27/09/2010 at 23:59 Постоянная ссылка Цитировать

    Сенкс, будем дальше копаться.. )

  15. Пожалуйста!

  16. Allexandriya
    04/10/2010 at 23:44 Постоянная ссылка Цитировать

    Привет еще раз)

    Наткнулась на проблему.. Установила оперу 10.62: Qj Скролл синхронен с скроллом Оперы. При этом все твои рекомендации по-поводу Оперы – соблюдены.

    З.Ы. при вставке в блок js показывающих спрятанный текст – высота блока не изменялась. Пофиксили.

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

  18. Окей. Спасибо

  19. Виктор
    06/10/2010 at 20:35 Постоянная ссылка Цитировать

    А меня бесит “рука” при наводе на скролл. К тому же, ни в одной программе этого эффекта нет.

  20. В CSS можно поставить cursor: default; и никакой руки не будет.

  21. Саблезубый Кролик (Sablezub)
    10/01/2011 at 10:36 Постоянная ссылка Цитировать

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

  22. Рад, что помог! =)

  23. Саблезубый Кролик (Sablezub)
    10/01/2011 at 17:56 Постоянная ссылка Цитировать

    Попробовал применить Ваш урок на практике и сразу трудности.
    Сам по себе скролл получается без проблем и очень красиво, а вот попытался установить его в Джумлу и … где и на каком месте он спотыкается не пойму. В кодах вижу, что jquery подключается, а вот самого скролла нет, хоть убей и как быть тоже не понятно. Может кто сталкивался? Помогите.

  24. Михаил Юрьевич
    18/01/2011 at 15:12 Постоянная ссылка Цитировать

    Фишка в том что Джумла использует не Jquery, а Mootols.
    Если подключать обе библиотеки одновременно (а Joomla подключает Motools по умолчанию) – то нифига не работает.
    Это потому что к функциям в обеих библиотеках нужно обращаться с помощью символа $ – браузер начинает путаться.

    Поищи в интернете “JQuery в Joomla” или “Joomla и Jquery” и все получится ;)

  25. Хм, если дело в конфликте библиотек, то у жука была функция, вызвав которую конфликтов жука с чем-либо (в частности прототайп) быть не должно. До версии 1.3 точно была в виде jQuery.noConflict(); Скорее всего она же и сейчас используется.

  26. Саблезубый Кролик (Sablezub)
    19/01/2011 at 9:49 Постоянная ссылка Цитировать

    Спасибо, за подсказку буду искать, если, что получится отпишусь.

  27. Я уже два дня мучаюсь – просто НИЧЕГО не выходит. Я уже пробовал и Ваши примеры брать – Ваш работает, а к себе перекопирую – всё. Разваливается.
    На сайте разрабов – ваще улет. Качайте говорят тут… Беру их демо страницу скачиваю и она уже не работает, хотя вроде со всеми библиотеками скачана.
    Ничего не пойму.
    Мне просто нужен был горизонтальный скролл…. :( (

  28. Ух. Тогда если не получается вставить код с другой страницы к себе, то надо сделать следующее. Берём страницу с примером и начинаем её обращивать уже вашим макетом и пошагово проверять, работает или нет. Я думаю у вас конфликт с какими-то другими скриптами.

  29. Виктор
    19/03/2011 at 12:54 Постоянная ссылка Цитировать

    Нет. У меня кроме ссылки на мой внешний стиль больше ничего пока нет.
    У меня проблема со знанием того – чего надо делать.
    Я просто не особо понимаю пару моментов:
    “Вызов функции”
    В вашем примере этот код находится в теле страницы, а в примерах этот код (правда не совсем такой, как в вашем примере) он в “head”
    Ещё я так и не понял про ID.
    ID видимо надо как-то чтоб совпадало в коде запуска этого скрипта с DIV-ом…
    но в “их” примерах ( Horizontal only
    )
    ID вообще нет…
    Мне видимо с моим уровнем знаний это дело вообще не светит…

    Вот например их страница: http://jscrollpane.kelvinluck.com/arrows.html
    А вот она же но на моем серваке: http://posmir.vermat.ru/123/arrows.html – она уже не работает.

  30. Для начала отключите в вашем примере demo.js.

    нет разницы, использовать ид или класс, это одни и те же селекторы.

    также нет разницы в хидере или в теле страницы. как правило подключаемые скрипты в хидере, а функции вызова где-нибудь в теле страницы – для сео лучше вообще чтобы перед закрытием боди они были, в самом конце.

    А вообще почитайте там у них на сайте линк How to use. Там чётко прописано, что нужно подключить и как вызывать скрипты. Просто побольше терпения и внимания

  31. Виктор
    19/03/2011 at 16:36 Постоянная ссылка Цитировать

    Наконец-то что-то получилось. Спасибо Вам за помощь.
    Но только не совсем правильно почему-то действует. Скролл почему-то не горизонтальный, а вертикальный…
    http://posmir.vermat.ru/123/index.html
    Подскажите, пожалуйста – это вообще осуществимо?
    http://posmir.vermat.ru/123/1.png
    Я хочу, чтобы скролились таблицы, которые я буду постоянно добавлять горизонтально (как на картинке – красным цветом – это то, что должно скролиться).
    Но они (сейчас их две) выстроились вертикально и скролятся также…. :(

  32. Виктор
    19/03/2011 at 22:14 Постоянная ссылка Цитировать

    Спасибо Вам за помощь.
    Пока возился – решил, что вертикальный скролл даже лучше будет.
    Вот: http://posmir.vermat.ru/

  33. Ну и правильно, вертикальный скролл всегда лучше, так как интуитивно понятнее.
    Рад был помочь

  34. Виктор
    21/03/2011 at 11:22 Постоянная ссылка Цитировать

    Здравствуйте, Александр.
    Я опять к вам. :(
    Заметил, что в IE сайт разваливается. Не подскажите в какую сторону смотреть?

  35. Добрый вечер!
    эммм, в сторону вёрстки, конечно же. надо смотреть и тестировать почему и как отваливается и в какой версии ишака.

  36. Виктор
    22/03/2011 at 15:38 Постоянная ссылка Цитировать

    Здравствуйте.
    Разобрался. И проблема была именно в верстке. Спасибо.
    Хотел бы узнать у вас ещё один момент…
    Я делаю сайт в Dreamweaver – и в нем естественно скрола никакого нет и макет сайта в нем выглядит есесьно ужасно убого и к тому же очень трудно вообще понять бывает что там изображено (из-за того, что всё, напиханое мной для скролла – торчит наружу и разрывает мне таблицу (и мозг ))) )
    Так вот – возможно-ли в принципе сделать так?: чтобы всё это скролящееся дело просто как-то подцеплялось из другого места?
    (внешний див)
    (внутренний див)
    ссылка на контент для скролла
    (/внутренний)
    (/внешний)
    Такое возможно?
    Я с удовольствием бы сам погуглил – но боюсь гугл меня не поймет – не знаю, как это сформулировать… :)

  37. Добрый день
    Помню, когда работал в нём, у меня была та же проблема, но я на неё просто забил – внедрял скрипты на страницу уже после всей вёрстки. Так что вариантов решения не знаю, и не знаю есть ли они.

  38. Я не понимаю как во втором варианте поменять высоту окна? скажите пожалуйста

  39. Эммм, а разве там не просто прописывается высота блока, которому и задаётся класс флекскролл?

  40. Эльвира
    30/04/2011 at 10:42 Постоянная ссылка Цитировать

    Пытаюсь сделать вертикальный скролл слева. Указываю true – бесполезно. Вообще скролл пропадает. Что делать?

  41. Попробуйте полностью дублировать пример здесь и подогнать его под себя.

  42. Эльвира
    30/04/2011 at 12:51 Постоянная ссылка Цитировать

    Александр, не получается, наверное, что-то неправильно делаю :( Помогите, плиз.

    У меня сейчас работает скролл правый http://grachioso.com/index.php?id=2

  43. Полагаю Вы не вносите изменения в CSS. Помимо scrollbarOnLeft: true нужно в CSS’е вместо right:0 прописать left:0 (там где был райт) и тогда усиленно он будет слева. Но это что касается старого jScrollPane, о котором я писал тут. В новой версии там иначе, ссылку я давал чуть выше

  44. Саша приветик! а можно ли сделать горизонатальный скролл на css?

  45. Александр Шуйский
    05/03/2012 at 20:06 Постоянная ссылка Цитировать

    Привет!
    Можно. Создаём один контейнер фиксированной ширины (и можно задать ему overflow scroll), а внутрь засовываем другой контейнер безразмерной ширины. В результате у внешнего контейнера будет скролл.

  46. Алексей
    01/05/2012 at 18:43 Постоянная ссылка Цитировать

    здравствуйте! решаил попробовать ваш скрол. все хорошо, но возникла проблема
    я его вставляю в ячейку, у которой высота не фиксирована.. Нужно чтоб блок со скрлом растягивался на всю высоту этой ячейки.
    Если поставить высоту контейнеру в 100%, то он растягивается на всю высоту контента и соответственно растягивает ячейку.
    А нужно, чтоб растягивался по высоте ячеки.

    Подскажите есть ли решение или хотя бы в каком напрвлении копать? четвертый день бьюсь

  47. Александр Шуйский
    02/05/2012 at 0:13 Постоянная ссылка Цитировать

    ммм… для начала попробуйте поискать готовые примеры и решения, всё таки статейка старая. если нет, то придётся курить jQuery и возможно отслеживать высоту окна браузера (window) через height() и динамически как-то менять параметры цсс. Ну, или хотя бы чтобы перед инициализацией плагина скролла проверять высоту окна, выставлять нужные цсс, а затем инициализировать скроллы.

  48. Спасибо! Воспользовался 2-ым способом – значительно легче (ИМХО). Не требует подключения библиотеки, а это плюс для ucoz – там подключена своя библиотека и они конфликтуют.
    Только вот вопрос: может кто знает как настроить скрорость прокрутки скрола во 2-ом способе?

  49. Александр Шуйский
    22/06/2012 at 1:09 Постоянная ссылка Цитировать

    Ммм, думаю стоит покопать в сторону vertical_scroll_amount (hesido.com/flexcroll/flexcroll-programming.htm) и поиграть с числом.

  50. Похоже на то, только я в этом не оч понимаю, это к самому подключаемому скрипту или в css? + там всё на английском, а гугл-перевордчик не лучший переводчик)

  51. TypeError: jQuery(…).jScrollPane is not a function
    jQuery(‘.scroll-pane’).jScrollPane();

    Здравствуйте все! Вот такую вот ошибку показывает консоль..помогите решить!спасибо..

  52. Александр Шуйский
    25/11/2013 at 11:22 Постоянная ссылка Цитировать

    ммм, вы точно подключили скрипт? и проверьте на всяк случай версию жкьюри

  53. все подключено..непойму в чем проблема

  54. есть код:


    <div class="content_main">
    <div class="p_content">
    <div id="content" class="scroll-pane">
    <h2>Почему мы здесь...</h2>
    <div class="post">
    <img src="images/volonter/demo.jpg" width="180" height="120" alt="фото" />
    <h4>Окси Сулименко</h4>
    <p>
    Когда я увидила что мясо напичканное
    гвоздями уже не 1 раз находят по городу!
    Осторожно, живодеры и прочие не любители
    животных не оставляют в покое бедных
    4-ногих! Будьте бдительны..
    </p>
    </div>
    <div class="clr"></div>
    <div class="post">
    <img src="images/volonter/demo.jpg" width="180" height="120" alt="фото" />
    <h4>Александра Кузнецова</h4>
    <p>
    Когда я увидила что мясо напичканное
    гвоздями уже не 1 раз находят по городу!
    Осторожно, живодеры и прочие не любители
    животных не оставляют в покое бедных
    4-ногих! Будьте бдительны..
    </p>
    </div>

    </div>
    </div>

    Разметка, вроде как, похожа на Вашу) но не получается..
    Не работает и все..помогите плиз! Очень нужна на сайт такая фитча)
    два div'a с классом post, именно их нужно скроллить..внутри div'a с id content

  55. Александр Шуйский
    26/11/2013 at 7:15 Постоянная ссылка Цитировать

    ну, похожа, может не до конца =)
    совет – когда какой-то скрипт не удаётся подстроить под свои реалии, стоит действовать следующим образом. берёте весь код примера и пихаете куда угодно к себе на страницу. если работает – значит со скриптами всё ок и надо просто взять и все классы перенести на свой пример. если нет, начинаем с проверки подключения библиотек и версии жкьюри, выясняя в чём может быть причина косяка.

  56. Спасибо! То что надо.

  57. Лариса
    28/11/2014 at 23:49 Постоянная ссылка Цитировать

    А у меня возник конфликт версий jquery
    jquery-1.11.1.min.js и jquery-1.2.6.js

    Теперь работает или скрол или слайдер :-)

    Пробовала перемещать их, менять порядок загрузки, не помогает

    Может есть более новая версия у вас на заметке?

  58. Александр Шуйский
    29/11/2014 at 9:56 Постоянная ссылка Цитировать

    jscrollpane.kelvinluck.com
    оно?
    1.2.6 уже динозавр, надо заставить работать плагин с текущей версией, ну, или плагин слайдера проверить в работе с 1.10.2. В общем, вперёд!=)

  59. Лариса
    29/11/2014 at 13:35 Постоянная ссылка Цитировать

    Александр, заработало с 1.11 когда взяла др. скрипты скрола с сайта jscrollpane.kelvinluck.com.

    Спасибо :-)

    До этого просто использовать новую версию jquery не помогало

  60. Лариса
    29/11/2014 at 13:56 Постоянная ссылка Цитировать

    У меня еще на странице этот скрол находится в блоке который скрыт изначально.
    А надо чтобы он был показан для срабатывания скрипта скрола,

    Поэтому сначала вызываю скрипт без $(document).ready
    а потом скрываю div в котором лежит скрол по $(document).ready :-)

  61. Александр Шуйский
    29/11/2014 at 15:40 Постоянная ссылка Цитировать

    Рад был помочь, так держать! =)

Добро пожаловать, коллега! Вы можете оставить свой отзыв:





Допустимые XHTML-теги:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Подписка на комментарии