﻿            var initialValue;
            var initialValue2;
            var initialValue3;
            var initialValue4;
            var initialValue5;
            
            function HandleClientLoaded(sender, eventArgs)
            {
                initialValue = sender.get_minimumValue();
                HandleClientValueChange(sender, null);
            }

            function HandleClientValueChange(sender, eventArgs)
            {
                var wrapperDiv = document.getElementById('slider_wrapper');
                var contentDiv = document.getElementById('slider');
                
                var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
                var change = sender.get_value() - oldValue;
                
                var contentDivHeight = contentDiv.scrollHeight - wrapperDiv.offsetHeight;
                var calculatedChangeStep = contentDivHeight / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
                
                initialValue = initialValue - change * calculatedChangeStep;
                
                if (sender.get_value() == sender.get_minimumValue())
                {
                    contentDiv.style.top = 0 + 'px';
                    initialValue = sender.get_minimumValue();
                }
                else
                {
                    contentDiv.style.top = initialValue + 'px';
                }
            }
            
            function HandleClientLoaded2(sender, eventArgs)
            {
                initialValue2 = sender.get_minimumValue();
                HandleClientValueChange2(sender, null);
            }

            function HandleClientValueChange2(sender, eventArgs)
            {
                var wrapperDiv = document.getElementById('slider_wrapper2');
                var contentDiv = document.getElementById('slider2');
                
                var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
                var change = sender.get_value() - oldValue;
                
                var contentDivHeight = contentDiv.scrollHeight - wrapperDiv.offsetHeight;
                var calculatedChangeStep = contentDivHeight / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
                
                initialValue2 = initialValue2 - change * calculatedChangeStep;
                
                if (sender.get_value() == sender.get_minimumValue())
                {
                    contentDiv.style.top = 0 + 'px';
                    initialValue2 = sender.get_minimumValue();
                }
                else
                {
                    contentDiv.style.top = initialValue2 + 'px';
                }
            }
            
            function HandleClientLoaded3(sender, eventArgs)
            {
                initialValue3 = sender.get_minimumValue();
                HandleClientValueChange3(sender, null);
            }

            function HandleClientValueChange3(sender, eventArgs)
            {
                var wrapperDiv = document.getElementById('slider_wrapper3');
                var contentDiv = document.getElementById('slider3');
                
                var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
                var change = sender.get_value() - oldValue;
                
                var contentDivHeight = contentDiv.scrollHeight - wrapperDiv.offsetHeight;
                var calculatedChangeStep = contentDivHeight / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
                
                initialValue3 = initialValue3 - change * calculatedChangeStep;
                
                if (sender.get_value() == sender.get_minimumValue())
                {
                    contentDiv.style.top = 0 + 'px';
                    initialValue3 = sender.get_minimumValue();
                }
                else
                {
                    contentDiv.style.top = initialValue3 + 'px';
                }
            }
            
            function HandleClientLoaded4(sender, eventArgs)
            {
                initialValue4 = sender.get_minimumValue();
                HandleClientValueChange4(sender, null);
            }

            function HandleClientValueChange4(sender, eventArgs)
            {
                var wrapperDiv = document.getElementById('slider_wrapper4');
                var contentDiv = document.getElementById('slider4');
                
                var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
                var change = sender.get_value() - oldValue;
                
                var contentDivHeight = contentDiv.scrollHeight - wrapperDiv.offsetHeight;
                var calculatedChangeStep = contentDivHeight / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
                
                initialValue4 = initialValue4 - change * calculatedChangeStep;
                
                if (sender.get_value() == sender.get_minimumValue())
                {
                    contentDiv.style.top = 0 + 'px';
                    initialValue4 = sender.get_minimumValue();
                }
                else
                {
                    contentDiv.style.top = initialValue4 + 'px';
                }
            }
            
            function HandleClientLoaded5(sender, eventArgs)
            {
                initialValue5 = sender.get_minimumValue();
                HandleClientValueChange5(sender, null);
            }

            function HandleClientValueChange5(sender, eventArgs)
            {
                var wrapperDiv = document.getElementById('slider_wrapper5');
                var contentDiv = document.getElementById('slider5');
                
                var oldValue = (eventArgs) ? eventArgs.get_oldValue() : sender.get_minimumValue();
                var change = sender.get_value() - oldValue;
                
                var contentDivHeight = contentDiv.scrollHeight - wrapperDiv.offsetHeight;
                var calculatedChangeStep = contentDivHeight / ((sender.get_maximumValue() - sender.get_minimumValue()) / sender.get_slideStep());
                
                initialValue5 = initialValue5 - change * calculatedChangeStep;
                
                if (sender.get_value() == sender.get_minimumValue())
                {
                    contentDiv.style.top = 0 + 'px';
                    initialValue5 = sender.get_minimumValue();
                }
                else
                {
                    contentDiv.style.top = initialValue5 + 'px';
                }
            }