Как поделить страницу на 2 области (на каждой своя полоса прокрутки)?

Question

[Алексей Чернов]

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

Comments

[Алексей Чернов]

При этом не должна быть видна сама полоса прокрутки, или изменить ее внешний вид

Answer 1

[Андрей Minisol]

<div class="block-left"></div>
<div class="block-right"></div>

и собственно теперь стилями:

.block-left{width:50%;height:800px;overflow:auto;float:left;}
.block-right{width:50%;height:800px;overflow:auto;}

Comments

[Алексей Чернов]

Все равно ведь блоки будут вместе прокручиваться

[Андрей Minisol]

jsfiddle.net/or0qLfh4/5

[Алексей Чернов]

AmadeyMinisol: а как в этом случае скрыть полосу прокрутки, но при этом область все равно прокручивалась?

[Андрей Minisol]

с помощь плагина например, jscrollpane называется вроде, ну или самостоятельно с помощью js отловить инвент mousewheel и в блоке сделать соответствующий offset с верху

Answer 2

[reifter]

Прописать блокам css

.block-1 {position:fixed;left:0;top:0;width:50%;height:100%;background:blue;color:#fff;overflow:auto;}
.block-2 {position:fixed;right:0;top:0;width:50%;height:100%;background:green;color:#fff;overflow:auto;}

Пример: codepen.io/anon/pen/BNoLBB

Comments

[Алексей Чернов]

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

[Алексей Чернов]

...сделать ее невидимой

Answer 3

[Сергей c0re]

самое простое это использовать iframe

Comments

[Алексей Чернов]

На JS бы...

[Сергей c0re]

тогда вариант - AmadeyMinisol

Answer 4

[sergealmazov]

Используйте фреймы!