Flex 效果_蹦蹦跳跳的面板

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">     
  <mx:Style>        
   Application{            backgroundGradientColors: #E2DEDE, #3C2580;         }       
   LinkButton {            rollOverColor: #000000;            selectionColor: #000000;          
    color: #ffffff;            textRollOverColor: #ffffff;            textAlign: center;         }   
  </mx:Style>        
 <mx:Script>       
  <![CDATA[            
   import mx.effects.easing.*;                        
   private function toggleBtn(e:MouseEvent):void{             
    if(e.currentTarget.label== "Open")                    
     panelOut.play();   
    else                     panelIn.play();   
   }         ]]> 
 </mx:Script>        
 <mx:Move id="panelOut" target="{panel}" yTo="0" effectEnd="btn.label='Close'"         duration="1500" easingFunction="Bounce.easeOut"/>       
 <mx:Move id="panelIn" target="{panel}" yTo="-180" effectEnd="btn.label='Open'"         duration="1000" easingFunction="Bounce.easeIn"/>          
 <mx:Canvas id="panel" width="100%" height="200" y="-180" backgroundColor="#000000">     <!--Add the content of your sliding panel here  --> 
  <mx:Label text="PUT YOUR CONTENT HERE" fontSize="30" color="#ffffff" horizontalCenter="0" verticalCenter="0"/>  
  <mx:LinkButton id="btn" width="100%"  height="21"               bottom="0" horizontalCenter="0"             label="Open"               click="toggleBtn(event)"/> 
 </mx:Canvas>          <!--Add the content of your page here  -->  
</mx:Application>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值