function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Mohita KalraMohita Kalra 

Hi All , I have this lightning component which has a moving text. I want to add onmouseover - pause and onmouseout - startagain kind of functionality

    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:attribute name="intervalId" type="Integer" default="0"/>
    <div id="parentDIV" style="overflow:hidden">
        <p style="position:relative;" id="tofloat">
            <b><span style="color:red">Important Note : </span>
            I am Floating (Left to Right) Imformation...</b>

Controller :
    doInit : function(component, event, helper) {
        var lWidth = window.innerWidth ;//Get the window's width
        //The setInterval() method calls a function or
        //evaluates an expression at specified intervals (in milliseconds).
        window.setInterval($A.getCallback(function() {
            helper.shiftDiv(component, event,lWidth);
        } ), 100);

Helper :
    shiftDiv: function(component, event,lWidth) {
        var changeposition = component.get("v.intervalId");
        var floatElement = document.getElementById('tofloat');   
        if(changeposition < lWidth){
   = changeposition+'px';
            changeposition = changeposition + 5;
        //reset the left to 0
   = "0px";
            changeposition = component.get("v.intervalId");//resetting so as to hit the if block again

Can someone advise how can i achieve this. I used onmouseover in div tag but getting stuck at what function should be used?
PS : Have copied this code from sfdcmonkey
AnudeepAnudeep (Salesforce Developers) 
Hi Mohita, 

If you want to show/hide the data, use onMouseOver (To show data value on mouse hover) and onMouseOut (To hide data value on mouse out)

If you want to take a look at sample code, see the following