Tooltip on a toggle



  • Hi all –

    What is the proper way to have a tooltip show when a user hovers over a toggle? We have a label, but hide the label when the screen real estate is too small. We want a tooltip to popup instead for the smaller screens. For some reason somethings like this:

    <q-toggle v-model=“filtered” class=“lt-sm” color=“teal” label="" @input=“onToggleShowSubscribedOnly” title=“text”>
    <q-tooltip>Show subscribed only</q-tooltip>
    </q-toggle>

    Only shows the tooltip when the toggle is clicked, not when hovered.

    thanks!



  • anyone? Tooltips on toggle just not supported?



  • Have you tried wrapping the q-tooltip in a div or span?

    <span>
      <q-toggle v-model=“filtered” class=“lt-sm” color=“teal” label="" @input=“onToggleShowSubscribedOnly” title=“text”>
      </q-toggle>
      <q-tooltip>Show subscribed only</q-tooltip>
    </span>
    


  • Yea, that’s what I ended up doing. Thanks Benoit!