FSW_7_Aug_8_PM/tooltip.html at main · CodeKul/FSW_7_Aug_8_PM · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<html>
  <head>
    <title>Tooltip</title>
    <style>
      .text {
        visibility: hidden;
        position: absolute;
        background-color: bisque;
      }

      .tooltip:hover .text {
        visibility: visible;
      }
    </style>
  </head>
  <body>
    <div class="tooltip">
      Hover me
      <div class="text">
        Lorem ipsum, dolor sit amet consectetur adipisicing elit. Blanditiis
        voluptas, consequatur, itaque nisi distinctio repellat dignissimos eos
        quam libero labore exercitationem ad asperiores alias id natus deleniti
        veritatis minus animi voluptatibus fugiat numquam? Excepturi quo, quas
        adipisci corporis quia accusantium illum ab ea sunt facilis autem nihil
        perferendis maxime, aut laudantium laboriosam atque debitis nulla ut
        veritatis. Ullam voluptas iste minima labore magnam mollitia incidunt
        vel, ipsum repellendus aut sit officiis libero nihil nostrum fuga quas
        facilis eius, inventore tempora eveniet odit ipsa unde. Deleniti
        delectus incidunt quod, enim architecto ullam quidem repellendus magni,
        eos quaerat repudiandae ea, reprehenderit recusandae.
      </div>
    </div>
    <p>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat mollitia
      amet doloremque laborum explicabo temporibus ipsam libero voluptatum.
      Possimus, iste?
    </p>
  </body>
</html>