Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Динамическое изменение контента со скроллом (https://javascript.ru/forum/dom-window/5308-dinamicheskoe-izmenenie-kontenta-so-skrollom.html)

Accessd 03.10.2009 17:34

Динамическое изменение контента со скроллом
 
Здравствуйте. Есть такая функция для реализации скроллинга в 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.


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