Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: Двойной горизонтальный скролл
Форумы портала PHP.SU » Клиентская разработка » HTML, Дизайн & CSS » Двойной горизонтальный скролл

Страниц (1): [1]
 

1. Pavelbeginner - 15 Июня, 2011 - 23:49:51 - перейти к сообщению
Есть ли css свойство, позволяющее сделать скролл внизу и вверху блока в случае его переполнения?
2. Давит - 16 Июня, 2011 - 00:04:15 - перейти к сообщению
CODE (html):
скопировать код в буфер обмена
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4.  <head>
  5.   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6.   <title>border-top-left-radius</title>
  7.   <style type="text/css">
  8.    .title {
  9.     background: #000080; /* Цвет фона */
  10.     color: #ffe; /* Цвет текста */
  11.     padding: 7px; /* Поля вокруг текста */
  12.     border-top-left-radius: 10px; /* Левый верхний уголок */
  13.     border-top-right-radius: 10px; /* Правый верхний уголок */
  14.    }
  15.    .content {
  16.     border: 1px solid #000080;  /* Параметры рамки */
  17.     background: #f0f0f0; /* Цвет фона */
  18.     padding: 7px; /* Поля вокруг текста */
  19.     border-bottom-left-radius: 10px; /* Левый нижний уголок */
  20.     border-bottom-right-radius: 10px; /* Правый нижний уголок */
  21.    }
  22.   </style>
  23.  </head>
  24.  <body>
  25.   <div class="title">Буквица</div>
  26.    <div class="content">
  27.     Буквица является художественным приемом оформления текста и
  28.     представляет собой увеличенную первую букву, базовая линия
  29.     которой ниже на одну или несколько строк базовой линии
  30.     основного текста.
  31.    </div>
  32.  </body>
  33. </html>
3. IllusionMH - 16 Июня, 2011 - 00:40:18 - перейти к сообщению
Pavelbeginner, можно сделать две полосы прокрутки: справа и снизу. (overflow: scroll;)
Двойной прокрутки в одном направлении(по горизонтали) возможно можно добиться некоторыми извращениями с вложенными блоками и синхронизацией перемещения с помощью JS

Никогда не видел приложения с прокруткой одного блока сверху и снизу
4. Pavelbeginner - 16 Июня, 2011 - 01:20:19 - перейти к сообщению
Я тоже не видел двух скроллов однонаправленных, но они мне надо) Через яваскрипт можно, но тогда нужно писать свой плагин эмулирующий работу скролла, а ради такой ерунды, не хочется тратить время.
5. IllusionMH - 16 Июня, 2011 - 03:22:40 - перейти к сообщению
Pavelbeginner, раз нужно и нет стандартных решений, получается что придется Недовольство, огорчение

UPD.Не спится что-то. Вариант нужно допилить(в плане размеров и показа/скрытия прокрутки при необходимости), но он вполне рабочий. Даже в ИЕ6 завелся без работы напильником.
Спойлер (Отобразить)

Спойлер (Отобразить)

Результат

Так что напильник в зубы и за работу ;)
6. Платинум - 16 Июня, 2011 - 08:20:36 - перейти к сообщению
flexcroll
7. IllusionMH - 16 Июня, 2011 - 09:20:56 - перейти к сообщению
Платинум, может плохо искал, но вот так сразу не нашел как сделать 2 прокрутки, а исходник пожат Недовольство, огорчение
А вообще интересный скрипт, правда платный(для комерческого использования).

Тоже когда-то задумывался написать JS "класс" для стилизации скроллбаров, но необходимость отпала.

 

Powered by ExBB FM 1.0 RC1