Js在拨动开关上添加工具提示

Question

I want to add a tooltip on toggle switch which looks like this:

And here is the code:

<div class="switch">
  <label>
    Off
    <input id="on-off" type="checkbox" checked>
    <span class="lever"></span> 
    On
  </label>
</div>

For example, when the mouse is over "On", I want to show the text "The tooltip is on" and over "Off", "The tooltip is off". Tried with different tutorials but not easy with toggle switch.

Answer 1

I want to add a tooltip on toggle switch which looks like this:

And here is the code:

<div class="switch">
  <label>
    Off
    <input id="on-off" type="checkbox" checked>
    <span class="lever"></span> 
    On
  </label>
</div>

For example, when the mouse is over "On", I want to show the text "The tooltip is on" and over "Off", "The tooltip is off". Tried with different tutorials but not easy with toggle switch.