Hello All!
I've a requirement where I need to display an image whenever hover on its image name in lightning component.
I want to show image tooltip. 
For which I tried the following code:

<div style="padding-left:2rem;padding-top:5rem;position:relative">
    This is a kind of different phenomena as 
        <a href="{!$Resource.HoverTooltip}" class="slds-popover__body">Help Text</a>
        is required
        <img url="https://www.theverge.com/2019/4/22/18511375/earth-day-google-doodle-wildlife-diversity"  />
        <div class="slds-popover slds-popover_tooltip slds-nubbin_bottom-left" role="tooltip" id="help" style="position:absolute;top:-4px;left:35px">
        <div class="slds-popover__body" content="{!$Resource.HoverTooltip}">{!$Resource.HoverTooltip}</div>
        </div>
</div>

And this doesn't works properly.
Any kind of help is welcome.
Thanks in advance!