Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Тег <div> со скролингом

Автор: Гость_nicka 21.3.2005, 00:44

Вопрос такой
Как сделать чтобы в теге <div> сидел скроллинг?

Автор: Aliance 21.3.2005, 01:00

Код


<div style="overflow: scroll">див со скроллингом...</div>

Автор: Гость_nicka 21.3.2005, 22:31

да, но что то не выходит никакой скроллинг

Код


<table width="490" height="100" border="1">
  <tr>
    <td width="21">&nbsp;</td>
    <td width="21">&nbsp;</td>
    <td width="426"><div style="overflow:scroll ">
  <p>dfdagfd</p>
  <p>&nbsp;</p>
  <p>d</p>
  <p>d</p>
  <p>d</p>
  <p>dggg</p>
    </div></td>
  </tr>
</table>

Автор: Aliance 21.3.2005, 23:22

Нужно задать height, т.к. у тебя текст маленький и он автоматом перемещается:

Код


<div style="overflow: scroll; height: 100px">
gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>
gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>
gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>
gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>gfgf<br>
</div>

PS: используя code, смотри за тем, какой ты язык выбираешь!

Автор: GoodBoy 22.3.2005, 13:12

Преренесено из "Веб-дизайна"

Автор: Гость_nicka 22.3.2005, 15:29

а как отключить ему горизонтальный скроллинг?

Автор: Aliance 22.3.2005, 16:15

Гость_nicka, зарегистрируйтесь и не обшайтесь анонимно :-)

Цитата

а как отключить ему горизонтальный скроллинг?

Горизонтальный отключен, вертикальный включен:

Код


.element {
   OVERFLOWX: hidden;
   OVERFLOWY: scroll;
}

Автор: Гость_nicka 22.3.2005, 19:14

а где вообще можно почитать про все эти теги, касающиеся <div и прочих тегов?

Автор: Гость_nicka 22.3.2005, 19:18

а вот так не работает

Код


<div    style="OVERFLOWX: hidden; OVERFLOWY: scroll; height: 100px; background:red; SCROLLBAR-BASE-COLOR: #ffffff; ">
    <table border="1">
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>fgfdg</td>
      </tr>
    </table>  
  
</div>

исчезают оба скроллинга

Автор: Aliance 22.3.2005, 19:36

Цитата

а где вообще можно почитать про все эти теги, касающиеся <div и прочих тегов?

http://www.w3.org

Цитата

а вот так не работает

Естественно, ты ведь высоту поставил 100, а содержимое - меньше. Сделай большой текст - увидешь прокрутку.

Автор: Guest 23.3.2005, 12:04

Цитата(Aliance @ 22.3.2005, 19:36)

Естественно, ты ведь высоту поставил 100, а содержимое - меньше. Сделай большой текст - увидешь прокрутку.

Да, но так тоже не работает!!!

Код


<div    style="OVERFLOWX: hidden; OVERFLOWY: scroll; height: 10px; background:red; SCROLLBAR-BASE-COLOR: #ffffff; ">
    <table border="1">
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td><p>fgfd</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>ffffg</p></td>
      </tr>
    </table>  
  
</div>

Автор: Aliance 23.3.2005, 13:04

Сори, прошу прошения, написал на JS ладе :-)))
Нужно не overflowY а overflow-y

Автор: Guest 23.3.2005, 13:56

ну с самого начала так бы!

Автор: Guest 23.3.2005, 22:52

а как сделать чтобы это все работало в Опере?
вернее мне нужен скролинг в Опере, а там его что то не видать

Автор: Aliance 23.3.2005, 23:07

Цитата(Guest @ 23.3.2005, 13:56)

ну с самого начала так бы!

Цитата

Гость, зарегистрируйтесь и не обшайтесь анонимно :-)

Цитата(Guest @ 23.3.2005, 22:52)

вернее мне нужен скролинг в Опере, а там его что то не видать

Попробуй поставь в самое начало HTML разметки тег <!DOCTYPE>

Автор: dm9 26.3.2005, 03:56

Всё там видать.
Установи диву фиксированный height, overflow: auto; и всё будет зашибись.
Читать тут:
http://www.webber.ru/articles/category.html?category_id=94
Тебя интересуют overflow, overflow-x, overflow-y.