asked on

show-hide on MOUSE OVER

hi guys
I have a button.when i put the mouse cursor on it , it should show the pop up , when the cursor is moved away from the button the popup should dissapear

my code:

<mx:Button id="teamMembersList" label="show" mouseOver="PopUp(event,projDetails.membersList);" />

private function PopUp(e:MouseEvent,list:ArrayCollection):void {
var popupwindow : IdWindowComponent = new IdWindowComponent();
var pt:Point = new Point(e.localX, e.localY);
pt = e.target.localToGlobal(pt);
popupwindow.x = pt.x ;
popupwindow.y = pt.y;
popupwindow.list = list;
popupwindow.listType = listType;
PopUpManager.addPopUp(popupwindow,this,false);
}

Right now the mouse over works, i see the pop up when i mouse over, but the popup comes with a X to close.
I want the pop up to dissapear when the mouse cursor is moved away from the button.

any clues how i can tweak the above code?

thanks

dgofman

I cannot understand why you are getting problem with this :)

import mx.managers.ToolTipManager;

private var popup:IToolTip;

private function show(event:Event, b:Boolean):void{
	var target:Button = event.target as Button;
	if(b == true){
		popup = ToolTipManager.createToolTip("Hello World", target.x + target.width, target.y, "errorTipRight");
	}else{
		ToolTipManager.destroyToolTip(popup);
	}
}

Open in new window

<mx:Button id="teamMembersList" label="show" mouseOver="show(event, true)" mouseOut="show(event, false)"/>

Jay Roy

ASKER

>>mouseOut
aahh.. thats the key, i dint know that.
i am new to flex dgofman, so plz bear with me if my questions are simple (and stupid) :-)

thanks.

dgofman

I am glad you are happy this my answers :)
Please can close this ticket from my list.

Jay Roy

ASKER

My code is slightly different, let me explain

popup:
private function launchPopUp(e:MouseEvent,list:ArrayCollection,show:Boolean):void {
if(show == true){
var popupwindow : IdWindowComponent = new IdWindowComponent();
var pt:Point = new Point(e.localX, e.localY);
pt = e.target.localToGlobal(pt);
popupwindow.x = pt.x ;
popupwindow.y = pt.y;
popupwindow.list = list; --setting list in IdWindowComponent shown below
PopUpManager.addPopUp(popupwindow,this,false);
}
else{ //if false
PopUpManager.removePopUp(popupwindow); //this should also work i guess?
}



}

<mx:Button label="show" mouseOver="launchPopUp(event,projDetails.teamMembersList,true);"
mouseOut="launchPopUp(event,projDetails.teamMembersList,false);" />

and this is my IdWindowComponent

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" width="186" height="262" horizontalAlign="center"
verticalAlign="top"
barColor="#000066"
borderColor="#000066">


<mx:Script>
<![CDATA[
public var list:ArrayCollection;
]]>
</mx:Script>
<mx:DataGrid id="dataGrid" dataProvider="{list}" width="146" height="201">
<mx:columns>
<mx:DataGridColumn dataField="id"/>      --display list in a grid
</mx:columns>
</mx:DataGrid>

</mx:TitleWindow>

the Mouseover and mouseout dont seem to work in this scenario, any idea where i am going wrong?

thanks.

dgofman

Are you using SDK 3 in your Eclipse (only), because you code for halo theme.

ASKER CERTIFIED SOLUTION

dgofman

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Jay Roy

ASKER

thanks v much.

any help with my next question is greatly appreciated.

https://www.experts-exchange.com/questions/26921802/send-email-on-button-click.html

thx.