Problem With Custom Scrollbar and Content...

  • ClevelandSlim
  • Born
  • Born
  • ClevelandSlim
  • Posts: 1

Post 3+ Months Ago

I have used this tutorial http://www.kirupa.com/developer/flash8/scrollbar.htm 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...

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


Code: [ Select ]
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();
  1. scrolling = function () {
  2. var scrollHeight:Number = scrollTrack._height;
  3. var contentHeight:Number = contentMain._height;
  4. var scrollFaceHeight:Number = scrollFace._height;
  5. var maskHeight:Number = maskedView._height;
  6. var initPosition:Number = scrollFace._y=scrollTrack._y;
  7. var initContentPos:Number = contentMain._y;
  8. var finalContentPos:Number = maskHeight-contentHeight+initContentPos;
  9. var left:Number = scrollTrack._x;
  10. var top:Number = scrollTrack._y;
  11. var right:Number = scrollTrack._x;
  12. var bottom:Number = scrollTrack._height-scrollFaceHeight+scrollTrack._y;
  13. var dy:Number = 0;
  14. var speed:Number = 10;
  15. var moveVal:Number = (contentHeight-maskHeight)/(scrollHeight-scrollFaceHeight);
  16. scrollFace.onPress = function() {
  17. var currPos:Number = this._y;
  18. startDrag(this, false, left, top, right, bottom);
  19. this.onMouseMove = function() {
  20. dy = Math.abs(initPosition-this._y);
  21. contentMain._y = Math.round(dy*-1*moveVal+initContentPos);
  22. };
  23. };
  24. scrollFace.onMouseUp = function() {
  25. stopDrag();
  26. delete this.onMouseMove;
  27. };
  28. btnUp.onPress = function() {
  29. this.onEnterFrame = function() {
  30. if (contentMain._y+speed<maskedView._y) {
  31. if (scrollFace._y<=top) {
  32. scrollFace._y = top;
  33. } else {
  34. scrollFace._y -= speed/moveVal;
  35. }
  36. contentMain._y += speed;
  37. } else {
  38. scrollFace._y = top;
  39. contentMain._y = maskedView._y;
  40. delete this.onEnterFrame;
  41. }
  42. };
  43. };
  44. btnUp.onDragOut = function() {
  45. delete this.onEnterFrame;
  46. };
  47. btnUp.onRollOut = function() {
  48. delete this.onEnterFrame;
  49. };
  50. btnDown.onPress = function() {
  51. this.onEnterFrame = function() {
  52. if (contentMain._y-speed>finalContentPos) {
  53. if (scrollFace._y>=bottom) {
  54. scrollFace._y = bottom;
  55. } else {
  56. scrollFace._y += speed/moveVal;
  57. }
  58. contentMain._y -= speed;
  59. } else {
  60. scrollFace._y = bottom;
  61. contentMain._y = finalContentPos;
  62. delete this.onEnterFrame;
  63. }
  64. };
  65. };
  66. btnDown.onRelease = function() {
  67. delete this.onEnterFrame;
  68. };
  69. btnDown.onDragOut = function() {
  70. delete this.onEnterFrame;
  71. };
  72. if (contentHeight<maskHeight) {
  73. scrollFace._visible = false;
  74. btnUp.enabled = false;
  75. btnDown.enabled = false;
  76. } else {
  77. scrollFace._visible = true;
  78. btnUp.enabled = true;
  79. btnDown.enabled = true;
  80. }
  81. };
  82. scrolling();


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

A link to the actual flash file is http://www.sweetvenus.net/flash/index-3.swf 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
http://www.sweetvenus.net/flash/scroll-problem.jpg

Thanks in advance for any assistance!
~Slim~
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23456
  • Loc: Woodbridge VA

Post 3+ Months Ago

The links to your examples aren't working. Have you solved the problem and removed them?

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 11 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.