您的位置:首页 > Web前端 > CSS

FLex组件之滚动条(ScrollBar)CSS美化

2010-02-24 20:46 585 查看
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Style>
ScrollBar
{
/*划动块图片皮肤*/
thumbDownSkin: Embed(source="scrollBar/thumb.gif",
scaleGridTop=2,
scaleGridLeft=2,
scaleGridBottom=4,
scaleGridRight=4
);
thumbOverSkin: Embed(source="scrollBar/thumb.gif",
scaleGridTop=2,
scaleGridLeft=2,
scaleGridBottom=4,
scaleGridRight=4
);
thumbUpSkin: Embed(source="scrollBar/thumb.gif",
scaleGridTop=2,
scaleGridLeft=2,
scaleGridBottom=4,
scaleGridRight=4
);

/*划动块中间图片(翻页图片)皮肤*/
thumbIcon: Embed("scrollBar/thumbIcon.gif");
/*轨迹图片(划动路径图片)皮肤*/
trackSkin: Embed("scrollBar/trackBack.jpg");

/*下/右翻图片皮肤*/
downArrowDisabledSkin: Embed("scrollBar/btnDown.jpg");
downArrowDownSkin: Embed("scrollBar/btnDown.jpg");
downArrowOverSkin: Embed("scrollBar/btnDownOver.jpg");
downArrowUpSkin: Embed("scrollBar/btnDown.jpg");
/*上/左翻图片皮肤*/
upArrowDisabledSkin: Embed("scrollBar/btnUp.jpg");
upArrowDownSkin: Embed("scrollBar/btnUp.jpg");
upArrowOverSkin: Embed("scrollBar/btnUpOver.jpg");
upArrowUpSkin: Embed("scrollBar/btnUp.jpg");
}

</mx:Style>
<mx:Panel x="129" y="70" width="389" height="303" layout="absolute">
<mx:Canvas x="10" y="10" width="349" height="234">
<mx:Text x="61" y="24" text="Text"/>
<mx:RadioButton x="61" y="50" width="500" label="Radio"/>
<mx:CheckBox x="61" y="89" label="Checkbox"/>
<mx:Button x="61" y="132" label="Button"/>
<mx:Button x="61" y="171" label="Button"/>
<mx:CheckBox x="61" y="199" label="Checkbox"/>
<mx:Button x="61" y="222" label="Button"/>
<mx:Button x="61" y="254" label="Button"/>
</mx:Canvas>
</mx:Panel>
</mx:Application>

转载地址http://www.gold98.net/blog/article.asp?id=876
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: