0 Replies Latest reply on Mar 28, 2008 8:18 AM by ClevelandSlim2

    Problem with a custom scrollbar

    ClevelandSlim2
      I have used this tutorial kirupa tutorial to create custom scrollbars in a flash site I am working on. In all instances I have used these scrollbars, they work perfectly except for one. The faq... it's about 2400 pixels tall, and is scrolling under a mask that is 450 pixels tall. Seems that the complete lenght of the faq does scroll, but you cannot view approximately the bottom third of the faq. it comes up blank.

      Can this be fixed?

      Here is the action scripting for the scrollbar (same as in the tutorial...

      --------------------------


      scrolling = function () {

      var scrollHeight:Number = scrollTrack._height;
      var contentHeight:Number = contentMain._height;
      var scrollFaceHeight:Number = scrollFace._height;
      var maskHeight:Number = maskedView._height;
      var initPosition:Number = scrollFace._y=scrollTrack._y;
      var initContentPos:Number = contentMain._y;
      var finalContentPos:Number = maskHeight-contentHeight+initContentPos;
      var left:Number = scrollTrack._x;
      var top:Number = scrollTrack._y;
      var right:Number = scrollTrack._x;
      var bottom:Number = scrollTrack._height-scrollFaceHeight+scrollTrack._y;
      var dy:Number = 0;
      var speed:Number = 10;
      var moveVal:Number = (contentHeight-maskHeight)/(scrollHeight-scrollFaceHeight);

      scrollFace.onPress = function() {

      var currPos:Number = this._y;
      startDrag(this, false, left, top, right, bottom);
      this.onMouseMove = function() {

      dy = Math.abs(initPosition-this._y);
      contentMain._y = Math.round(dy*-1*moveVal+initContentPos);

      };

      };
      scrollFace.onMouseUp = function() {

      stopDrag();
      delete this.onMouseMove;

      };
      btnUp.onPress = function() {

      this.onEnterFrame = function() {

      if (contentMain._y+speed<maskedView._y) {

      if (scrollFace._y<=top) {

      scrollFace._y = top;

      } else {

      scrollFace._y -= speed/moveVal;

      }
      contentMain._y += speed;

      } else {

      scrollFace._y = top;
      contentMain._y = maskedView._y;
      delete this.onEnterFrame;

      }

      };

      };
      btnUp.onDragOut = function() {

      delete this.onEnterFrame;

      };
      btnUp.onRollOut = function() {

      delete this.onEnterFrame;

      };
      btnDown.onPress = function() {

      this.onEnterFrame = function() {

      if (contentMain._y-speed>finalContentPos) {

      if (scrollFace._y>=bottom) {

      scrollFace._y = bottom;

      } else {

      scrollFace._y += speed/moveVal;

      }
      contentMain._y -= speed;

      } else {

      scrollFace._y = bottom;
      contentMain._y = finalContentPos;
      delete this.onEnterFrame;

      }

      };

      };
      btnDown.onRelease = function() {

      delete this.onEnterFrame;

      };
      btnDown.onDragOut = function() {

      delete this.onEnterFrame;

      };

      if (contentHeight<maskHeight) {

      scrollFace._visible = false;
      btnUp.enabled = false;
      btnDown.enabled = false;

      } else {

      scrollFace._visible = true;
      btnUp.enabled = true;
      btnDown.enabled = true;

      }

      };
      scrolling();

      --------------------------

      A link to the actual flash file is SWF file and to see the scrollbar problem in action view the flash file and hit the FAQ link, the faq content displays the problem.

      Here is a screenshot of the flash file worked in Flash 8 Pro
      Screenshot