dojo ContentPane OnMouseOut can"t work well

Question

The code is like below

the problem is that sometimes the contentPane with html content cannot close when the mouse move out of the cell filled with name field of the grid.

var myContentPane;

            grid.on("CellMouseOver",function(evt){

                var cell=evt.cell;

                rowData=grid.getItem(evt.rowIndex);

                if(cell.field=="name"){
                    require([
                             "dojox/layout/ContentPane",
                             "dijit/popup"
                         ], function(ContentPane, popup){

                                if(myContentPane){
                                    popup.close(myContentPane);
                                }

                                myContentPane = new ContentPane({
                                    style: "width:300px;background:#dddddd",
                                    content:"html content string has some links in it",
                                    onMouseLeave:function(){
                                       popup.close(myContentPane);
                                    }
                                });

                                popup.open({
                                     popup: myContentPane,
                                     around: dom.byId(rowData.name),
                                });
                         });

              }
            });

Answer 1

Hi try to connect the OnMouseOut like this.

First setup your Contentpane :

myContentPane = new ContentPane({
                id:"myContentPane",
                style: "width:300px;background:#dddddd",
                content:"<p style='text-align:center;'>"....
                }, "MyContentPaneDiv");

The connect the onMouseOut:

      myContentPane.on("MouseOut",function(){
               //do what you want to do;
       });

Think this should help u out.

Regards