Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   scrollable div with fixed content (https://javascript.ru/forum/events/25069-scrollable-div-fixed-content.html)

lampochkin 24.01.2012 14:19

scrollable div with fixed content
 
как сделать div с overflow:auto; так, чтобы часть текстового содержимого не двигалась при скроллинге?

Pavel M. 24.01.2012 14:47

можно так, только зачем ?

<div style="overflow:auto; width:220px; height:150px;">
    <p style="position: fixed; width:200px;">Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
</div>

Nekromancer 24.01.2012 15:03

Цитата:

Сообщение от Pavel M. (Сообщение 152493)
можно так, только зачем ?

Оно так от body позиционируется.

Pavel M. 24.01.2012 15:14

в первом сообщении было
"как сделать div с overflow:auto; так, чтобы часть текстового содержимого не двигалась при скроллинге?"

div с overflow:auto - это есть

часть текстового содержимого не двигалась при скроллинге? - не двигается ни при скроллинге дива, ни при скроллинге страницы :-)

lampochkin 24.01.2012 15:33

Павел, конечно, скроллинг дива.

Pavel M. 24.01.2012 16:53

можно так

<div style="overflow:auto; width:220px; height:250px;" onscroll="this.children[0].style.top = this.scrollTop + 'px'">
    <p style="position: relative;">Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
    <p>Съешь же ещё этих мягких французских булок, да выпей чаю.</p>
</div>


Часовой пояс GMT +3, время: 02:18.