3
<tr onmouseover="{!c.showEditIcon}"> 
    <td colspan="2">   
        <c:DFActivityCardCmp activity="{!activity}" uiThemeDisplayed="{!v.uiThemeDisplayed}"/> 
    </td>
    <td class="vertical-align-center">
        <div class="slds-align--absolute-center"> 
            <i aura:id="editIcon" class="fa fa-pencil slds-hide" aria-hidden="true"></i>
        </div>                      
    </td>
</tr>

//controller method

 showEditIcon : function(component, event, helper) { 
    console.log(event.target); 
}

When hovered on <tr>, console(event.target) is printing the object of children of <tr>. When hovered on I want to remove the class 'slds-hide' of tag. Since I am not getting <tr> object on hover, I am not able to get the object of <i>. Hence, I am unable to do DOM manipulation.

5

I found the solution. I used mouseenter event instead of mouseover and it worked.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.