想做一个悬浮菜单,自动隐藏到界面边缘,鼠标移上去时滑动展开。在网上找到一个代码,效果里面有点小小bug:鼠标移到面板位置不动时,面板会一直闪烁。我对代码进行了一点优化,现在可以正常的展现:
- <!-- Simple example to demonstrate the Move effect. -->
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()">
- <mx:Script>
- <![CDATA[
- import mx.controls.Alert;
- private function init():void{
- //初始默认将百分之九十的图片隐藏起来。通过y轴的福坐标来设置
- img.y=0-(img.height*0.90
- }
- //当鼠标覆盖的时候 将图片显示出来
- private function moveMOverImage():void {
- /////////////优化///////////
- if(myMove.isPlaying)
- myMove.stop();
- ///////////////////////////
- myMove.yTo=0;
- myMove.play();
- }
- //鼠标移开的时候在将图片重新隐藏
- private function moveMOutImage():void {
- /////////////优化///////////
- if(myMove.isPlaying)
- myMove.stop();
- ///////////////////////////
- myMove.yTo=0-(img.height*0.90);
- myMove.play();
- }
- ]]>
- </mx:Script>
- <mx:Move id="myMove" target="{img}" />
- <mx:Panel title="Move Effect Example" width="95%" height="95%"
- paddingTop="5" paddingLeft="10" paddingRight="10" paddingBottom="5">
- <mx:Canvas id="canvas" width="100%" height="100%" >
- <mx:Image id="img" source="@Embed(source='beijing.png')" mouseOver="moveMOverImage();" mouseOut="moveMOutImage();" />
- </mx:Canvas>
- </mx:Panel>
- </mx:Application>
<?xml version="1.0"?> <!-- Simple example to demonstrate the Move effect. --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()"> <mx:Script> <![CDATA[ import mx.controls.Alert; private function init():void{ //初始默认将百分之九十的图片隐藏起来。通过y轴的福坐标来设置 img.y=0-(img.height*0.90 } //当鼠标覆盖的时候 将图片显示出来 private function moveMOverImage():void { /////////////优化/////////// if(myMove.isPlaying) myMove.stop(); /////////////////////////// myMove.yTo=0; myMove.play(); } //鼠标移开的时候在将图片重新隐藏 private function moveMOutImage():void { /////////////优化/////////// if(myMove.isPlaying) myMove.stop(); /////////////////////////// myMove.yTo=0-(img.height*0.90); myMove.play(); } ]]> </mx:Script> <mx:Move id="myMove" target="{img}" /> <mx:Panel title="Move Effect Example" width="95%" height="95%" paddingTop="5" paddingLeft="10" paddingRight="10" paddingBottom="5"> <mx:Canvas id="canvas" width="100%" height="100%" > <mx:Image id="img" source="@Embed(source='beijing.png')" mouseOver="moveMOverImage();" mouseOut="moveMOutImage();" /> </mx:Canvas> </mx:Panel> </mx:Application>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。