I have used a skin for scrollbar thumb whose PNG image size is 14x21 but which will be scaled vertically between its present height and extended height 498px. I have been trying to understand the 9 slice scaling parameters to assign to the thumb image so that it does not distort but I'm unable to achieve that. The CSS which has come closest to least distortion is follwing (though UI view of this is also not acceptable) is this:
thumb-skin: Embed(source="assets/images/scroll_thumb.png",scaleGridLeft="1", scaleGridTop="4", scaleGridRight="13", scaleGridBottom="17");
Though the thumb looks fine with height 498px but the three horizontal lines in middle of the thumb.PNG become rectangles!!. I tried many combinations with these parameters and read a couple of blogs etc but cant get to the solution.
Any help on this guys? Your inputs are welcome