Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.10.2009, 17:34
Accessd
 
Сообщений: n/a

Динамическое изменение контента со скроллом
Здравствуйте. Есть такая функция для реализации скроллинга в div'е(используется класс Slider из mootools):
function makeScrollbar(content, scrollbar, handle, horizontal, ignoreMouse){
			  				  				  				  
        if (!horizontal || (content.getScrollSize().x > content.getSize().x)) {
            if (horizontal || (content.getScrollSize().y > content.getSize().y)) {
				var steps = (horizontal ? (content.getScrollSize().x - content.getSize().x) : (content.getScrollSize().y - content.getSize().y))
                var slider = new Slider(scrollbar, handle, {
                    steps: steps,
                    mode: (horizontal ? 'horizontal' : 'vertical'),
                    onChange: function(step){
						var x = (horizontal ? step : content.getScroll().x);
                        var y = (horizontal ? content.getScroll().y : step);
                        content.scrollTo(x, y);
                    }
                }).set(0);
				
				setScrollDown = function (){
					slider.set(content.getScrollSize().y);
				}
								
				setScrollUp = function (){
					slider.set(0);
				}
				
                if (!horizontal) {
                    $$('.v-up').addEvent('mousedown', function(){
                        slider.set(slider.step - 30);
                    });
                    $$('.v-down').addEvent('mousedown', function(){
                        slider.set(slider.step + 30);
                    });
                }
                if (horizontal) {
                    $$('.h-left').addEvent('mousedown', function(){
                        slider.set(slider.step - 30);
                    });
                    $$('.h-right').addEvent('mousedown', function(){
                        slider.set(slider.step + 30);
                    });
                }
                if (!(ignoreMouse)) {
			var mousewheel = function(e){
                        e = new Event(e).stop()					
                        slider.set(slider.step - e.wheel * 30);
                    }
                    $$(content, scrollbar).addEvent('mousewheel', mousewheel);
                }
                $(document.body).addEvent('mouseleave', function(){
                    slider.drag.stop()
                });
            }
            else {
                $$('.vscroll').setStyle('visibility', 'hidden');
            }
        }
        else {
            $$('.hscroll').setStyle('visibility', 'hidden');
        }
		
    }


Все работает нормально, если скроллируемый контент статичный, но если применяю innerHTML, то высота скроллируемого контента соответственно увеличивается и он обрезается. Как мне правильно переопределить скролл после увеличения высота контента? По сути меняется content.getScrollSize().y, и мне надо создать новый slider.
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическое изменение содержимого фрейма VetalStar Элементы интерфейса 3 21.12.2010 23:14
Сложный случай jQuery + AJAX + динамическое изменение страницы Opera/IE no. Общие вопросы Javascript 2 24.02.2009 04:24
Динамическое изменение <input text> baal1988 Events/DOM/Window 4 24.08.2008 17:17
В IE не работает динамическое изменение colspan, нужна помощь! Extasy Общие вопросы Javascript 8 17.08.2008 11:55
Динамическое изменение размеров изображения Макс Элементы интерфейса 7 21.07.2008 16:55