Question 269760 in Html Question posted in
Some basic documentation can be found here.

Html – Tooltip on buttn in navbar


<nav class="navbar navbar-expand-lg  bg-purple">  <!--bg-body-tertiary-->
  <div class="container-fluid">
    <a class="navbar-brand" href="#"><img src="queShield1.gif" alt="shield" width="80"></a>    
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav">
        <li class="nav-item">
          <a class="nav-link active " aria-current="page" href="#"><strong>
          <span class="style5 ">Home</span></strong></a><strong><span class="style5" title="Home" >
          </span></strong>
        </li>

I tried using a css reference and then tried placing it in the navbar however no results.

The objective is to mouseover the button and have a message to display

Tags:

2

Answers


  1. 0

    Displaying a text while hovering is easy to achieve. Use a hyperlink tag with empty href and provide the text to be displayed as title.
    It is as simple as this:

    <a href = " " title = "The text to be displayed"><button>Click Me</button></a>
    Login or Signup to reply.
  2. 0

    From bootstrap! Let me know if this helps.

    <button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">
  Tooltip on top
</button>

    https://getbootstrap.com/docs/4.0/components/tooltips/

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search