Start Building Professional
Web Apps Today

OnMouseIn fine tuned?

I would like to catch the event related to the cursor being over the text part of the tree node...

Is there any way of doing it?


Regards.

It possible to attach custom code, which will be called when mouse moved over tree item ( this includes both text and image or item )

tree.attachEvent("onMouseIn",function(id){
      //id - id of tree item
});

I guess I didn't make myself very clear :-)

I know I can attach the OnMouseIn event to the tree and capture the event of the cursor being over the tree item and then associate some code on that event.

What I would like to do, is to go further and be able to determine which part of the node is being rolled over. In my specific case, I need to execute some code only in case the cursor gets on the text part of the node and not on the images or the "+" sign.


Thanks

It will require some code modification, because existing event will not provide such info

dhtmlxtree.js , line 4817

   dhtmlXTreeObject.prototype._itemMouseIn=function(){
        var that=this.childNodes[3].parentObject;
        var tree=that.treeNod;

        if (tree._l_onMSI!=that.id) tree.callEvent("onMouseIn",[that.id]);

Can  be updated as

   dhtmlXTreeObject.prototype._itemMouseIn=function(e){
        var that=this.childNodes[3].parentObject;
        var tree=that.treeNod;

        if (tree._l_onMSI!=that.id) tree.callEvent("onMouseIn",[that.id,(e?e.target:event.srcElement)]);

After such modification, you will receive the element under mouse as second parameter of event

tree.attachEvent("onMouseIn",function(id,el){
       if (el.tagName=="span"){
             //mouse moved exactly over text
        }
});

Thanks the hack seems to work but one precision though.... The tagName "span" doesn't seem to be the good srcElement; the one that's being captured is "TD" and unfortunately seems slightly larger than the text part of the node. A reaction?

In case of IE, the event can miss node if it has no value or background , you can try to set background color of it by changing .standartTreeRow in dhtmlxtree.css
    .standartTreeRow{   
       background-color:white; // or any other  suitable color

as result event on span area must be correctly fired.