Explorer-like layout
От: baranovda Российская Империя  
Дата: 30.01.15 12:30
Оценка:
Поможите, пожалуйста, всю голову сломал.
Нужен проводниковообразный layout — две колонки, слева div-контейнер с jstree, справа div-контейнер с динамическим ajax-содержимым.
Если контент дерева не влезает в высоту броузера — нужно сделать так, чтобы скроллилась не сама страница, а контейнер дерева.
Аналогично с правым контейнером.
Оба контейнера должны занимать 100% высоты клиенской области броузера.
К странице подключен jQuery.

Еще вопрос — как проделать то же самое, имея в распоряжении twitter bootstrap.
Re: Explorer-like layout
От: vsb Казахстан  
Дата: 30.01.15 13:59
Оценка:
http://jsfiddle.net/0z0mppuo/
Re[2]: Explorer-like layout
От: baranovda Российская Империя  
Дата: 30.01.15 18:13
Оценка:
Здравствуйте, vsb, Вы писали:

vsb>http://jsfiddle.net/0z0mppuo/


Это очевидный вариант, не фурычет Добавил для body и html margin и padding 0, для td — overflow: scroll и заполнил ячейки мусором

http://jsfiddle.net/u0nuLb48/1/
Re[3]: Explorer-like layout
От: vsb Казахстан  
Дата: 30.01.15 18:27
Оценка: 6 (1)
Пардон, про скролл не так прочитал. Тогда всё даже проще: http://jsfiddle.net/k3d4c1df/
Re: Explorer-like layout
От: Cornetov Россия  
Дата: 30.01.15 19:13
Оценка:
Здравствуйте, baranovda, Вы писали:

B>Еще вопрос — как проделать то же самое, имея в распоряжении twitter bootstrap.


В Twitter Bootstrap можно использовать ScrollSpy.

Я устанавливаю ScrollSpy в нужный размер окна через скрипт:
$(document).ready(function(){
    $("div.scroll-area").each(function(){

            var scrollHeight = document.documentElement.scrollHeight; 
            var clientHeight = document.documentElement.clientHeight; 
            scrollHeight = Math.max(scrollHeight, clientHeight) - 200;    // 200px is header height 
            this.style.height = scrollHeight.toString() + 'px';
        });
});
Re[4]: Explorer-like layout
От: c-smile Канада http://terrainformatica.com
Дата: 30.01.15 21:56
Оценка:
Здравствуйте, vsb, Вы писали:

vsb>Пардон, про скролл не так прочитал. Тогда всё даже проще: http://jsfiddle.net/k3d4c1df/


Тогда уже position: fixed;
 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.