$(function() {
	settings = {
		img_up         : '../layout/screen/scroll_up.jpg',
		img_up_hover   : '../layout/screen/scroll_up_hover.jpg',
		img_down       : '../layout/screen/scroll_down.jpg',
		img_down_hover : '../layout/screen/scroll_down_hover.jpg'
	}

    container = $('#sys_scrollbar_container');
    scrollbar = $('#sys_scrollbar');

    $('#sys_scrollbar_up').hover(function() {
    	scrollToArrowUp = (0 - parseInt(scrollbar.css('top')));

    	scrollbar.stop().animate({top :  0 + 'px' }, scrollToArrowUp / 93 * 750, "linear");

    	$('#sys_scrollbar_up').find('img').attr('src', settings.img_up_hover);
    },function() {
       scrollbar.stop();
       $('#sys_scrollbar_up').find('img').attr('src', settings.img_up);
    })

    $('#sys_scrollbar_down').hover(function() {
    	scrollToArrowDown = (scrollbar.height() - container.height());
    	scrollPosNow = parseInt(scrollbar.css('top'));
        scrollSpeed = scrollToArrowDown + scrollPosNow;

    	scrollbar.stop().animate({top :  '-' + scrollToArrowDown }, scrollSpeed  / 93 * 750, "linear");
    	$('#sys_scrollbar_down').find('img').attr('src', settings.img_down_hover);

    },function() {
    	scrollbar.stop();
    	$('#sys_scrollbar_down').find('img').attr('src', settings.img_down);
    })

    scrollbar.find('a').click(function() {
        $('#sys_picture_container_loading').css({opacity: .3}).show();

    	obj = new Image();
		obj.onload = function() {
			$('#sys_picture_container_loading').hide();
			$('#sys_picture_container').find('img').attr('src', obj.src);

			theImg = $('#sys_scrollbar_image');
        	theImg = theImg.height()-32;
            //container.css({height: theImg+'px'});

			obj.onload=function(){};

		};

    	obj.src = $(this).attr('href');
    	return false;
    })

});