Hej,
Har kopieret en simpel tooltip fra google søgning.
--> kode:
- .tooltip {
- display: inline;
- position: relative;
- }
- .tooltip:after {
- background: #333;
- background: rgba(0,0,0,.8);
- border-radius: 5px;
- bottom: 26px;
- color: #fff;
- content: attr(title);
- left: 20%;
- padding: 5px 15px;
- position: absolute;
- z-index: 98;
- width: 220px;
- }
- .tooltip:hover:before {
- border: solid;
- border-color: #333 transparent;
- border-width: 6px 6px 0 6px;
- bottom: 20px;
- content: "";
- left: 50%;
- position: absolute;
- z-index: 99;
- }
Men problemet er at når jeg har kørt musen indover linket, så viser den tooltip som jeg ønsker det. Men den forsvinder bare ikke igen. Heller ikke ved at klikke væk fra siden og tilgå siden igen. Den viser tooltip hele tiden.
Det jo ikke mit ønske. Den skal fungere som et title="" i et link <a href="" title="Hej">link</a>
Hvor den fader ud igen efter få sekunder.
Men her sker der intet i den retning.
Gør jeg nok forkert i den style?.
Noget der kan hjælpe med at få den til at fungere optimalt ved at fjerne noget eller tilføje noget?...
Gider ikke de der tooltip med javascript, når man kan få det med blot css/html.
