# Issue with Horizontal Scrollbar and MoveIt MC transitions

**URL:** <https://forum.kirupa.com/t/issue-with-horizontal-scrollbar-and-moveit-mc-transitions/324474>\
**Category:** flash\
**Created:** [August 22, 2011, 11:07pm UTC](https://forum.kirupa.com/t/issue-with-horizontal-scrollbar-and-moveit-mc-transitions/324474 "2011-08-22T23:07:00Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![mileskemp](https://avatars.discourse-cdn.com/v4/letter/m/a587f6/32.png) [@mileskemp](https://forum.kirupa.com/u/mileskemp)\
**Post date:** [August 22, 2011, 11:07pm UTC](https://forum.kirupa.com/t/issue-with-horizontal-scrollbar-and-moveit-mc-transitions/324474/1 "2011-08-22T23:07:00Z")

</div>

Hi,  
I am using a MoveIt function to show a horizontal scrollbar in State 1 and then another mc in State 2. The scrollbar is working perfectly when the flash animation loads but after I switch to State 2 and back to State 1 the scrollbar no longer functions. Any suggestions? I would like to make it so that the scrollbar stays in its last position and is always working without reloading. I am attaching the file.

I would greatly appreciate your help. You rule!

\*\*  
Here is my code for the scrollbar\*\*  
scrolling = function (){  
var scrollWidth:Number = scrollTrack.\_width;  
var contentWidth:Number = characters.\_width;  
var scrollFaceWidth:Number = scrollFace.\_width;  
var maskWidth:Number = maskedView.\_width;  
var initPosition:Number = scrollFace.\_x=scrollTrack.\_x;  
var initContentPos:Number = characters.\_x;  
var finalContentPos:Number = maskWidth-contentWidth+initContentPos;  
var left:Number = scrollTrack.\_x;  
var top:Number = scrollTrack.\_y;  
var right:Number = scrollTrack.\_width-scrollFaceWidth+scrollTrack.\_x;  
var bottom:Number = scrollTrack.\_y;  
var dy:Number = 0;  
var speed:Number = 10;  
var moveVal:Number = (contentWidth-maskWidth)/(scrollWidth-scrollFaceWidth);  
scrollFace.onPress = function(){  
var currPos:Number = this.\_x;  
startDrag(this, false, left, top, right, bottom);  
this.onMouseMove = function() {  
dy = Math.abs(initPosition-this.\_x);

```
        // I changed characters._x with charactersXGoal, which represents
        // the final ease step position of the characters.
        charactersXGoal = Math.round(dy*-1*moveVal+initContentPos);
    };
}
scrollFace.onMouseUp = function(){
    stopDrag();
    delete this.onMouseMove;
};
if (contentWidth&lt;maskWidth){
    scrollFace._visible = false;
    btnUp.enabled = false;
    btnDown.enabled = false;
}else{
    scrollFace._visible = true;
    btnUp.enabled = true;
    btnDown.enabled = true;
}

// When we increase the variable easeSlowness, the movement speed decreases.
easeSlowness = 10;

// I introduced the variable widthBetweencharactersAndNextStep which represents 
// the numerical difference between the actual characters._x and the next ease position.
widthBetweencharactersAndNextStep = 0;

// I used the onEnterFrame function because the movements of the scrollFace
// and the characters can not be synchronized when we do a scroll ease.
onEnterFrame = function() {

    // widthBetweencharactersAndNextStep : description is above.
    widthBetweencharactersAndNextStep = (charactersXGoal - characters._x)/easeSlowness;
    
    // We add this difference to the characters._x, the result is the characters next ease step.
    charactersXNextEaseStep = characters._x + widthBetweencharactersAndNextStep;

    characters._x = Math.round (charactersXNextEaseStep);

}

```

};  
scrolling();

**and the transitions**  
Viewing\_Area\_1.onEnterFrame = function()  
{  
Viewing\_Area\_1.\_x;  
Viewing\_Area\_1.\_y;  
speed2 = 10;  
function moveIt(endX, endY)  
{  
Viewing\_Area\_1.onEnterFrame = function()  
{  
this.\_x += (endX - this.\_x) / speed2;  
this.\_y += (endY - this.\_y) / speed2;  
if (Math.abs(this.\_x - endX) == 1 && Math.abs(this.\_y - endY) == 1)  
{  
this.\_x = endX;  
this.\_y = endY;  
}  
};  
}  
moveIt(0,0);  
};  
Viewing\_Area\_2.onEnterFrame = function()  
{  
Viewing\_Area\_2.\_x;  
Viewing\_Area\_2.\_y;  
speed1 = 5;  
function moveIt(endX, endY)  
{  
Viewing\_Area\_2.onEnterFrame = function()  
{  
this.\_x += (endX - this.\_x) / speed1;  
this.\_y += (endY - this.\_y) / speed1;  
if (Math.abs(this.\_x - endX) == 1 && Math.abs(this.\_y - endY) == 1)  
{  
this.\_x = endX;  
this.\_y = endY;  
}  
};  
}  
moveIt(0,-1200);  
};  
stop();