You can do this in CSS fairly easily. If you place the tool tip span
within the video title span
, you can set it to display:none
and have it change to display: block
when the video title is hovered.
<span class="video-title">
Title text here
<span class="tooltip">Tooltip text here</span>
</span>
.video-title {position: relative}
.tooltip {display: none;}
.video-title:hover .tooltip {display: block; position: absolute;}
Obviously you would add your own styling and positioning to that. The tooltip should ideally be absolutely positioned so that it doesn’t interfere with the layout of your page. Setting it’s parent to position: relative
ensures the tooltip is positioned in relation to its parent’s position on the page.
1
solved I want to change display property of this span class [closed]