Avatar billede kusken Nybegynder
07. august 2014 - 13:08 Der er 6 kommentarer

CSS title tooltip

Hej,

Er det muligt at style et title tooltip med CSS? Jeg har lavet nedenstående eksempel. Funktionaliteten er jeg fint tilfreds med, men jeg kunne godt tænke mig at ændre udseendet på tooltippet.

<html>
<head>
<title></title>
</head>
<body>
<table border="1" cellpadding="0" cellspacing="0" style="width: 300px; height: 100px;">
<tbody>
<tr>
<td title="Hover 1"></td>
<td title="Hover 1"></td>
<td title="Hover 1"></td>
</tr>
</tbody>
</table>
</body>
</html>
Avatar billede jakobdo Ekspert
07. august 2014 - 13:32 #1
Så skal du evt. kigge på noget ala:
http://jqueryui.com/tooltip/
http://iamceege.github.io/tooltipster/
http://qtip2.com/
http://getbootstrap.com/javascript/#tooltips

Og der findes selvfølgelig mange mange flere på nettet.
Avatar billede kusken Nybegynder
07. august 2014 - 14:26 #2
Hej jakobdo,

Ved du om der findes noget i ren CSS?

Jeg kan ellers rigtig godt lide Tooltipster som du henviser til, men det må helst ikke være javacript/jQuery.

Jeg har fundet denne:

http://www.menucool.com/tooltip/css-tooltip

Men, jeg kan ikke helt få det til at spille som jeg vil.
Avatar billede keysersoze Guru
07. august 2014 - 14:31 #3
Den du henviser til er ren CSS så selvfølgelig findes det - en anden mulighed er http://csstooltip.com/. Men hvis det ikke virker i dit tilfælde så få først og fremmest rettet op på din første store fejl, nemlig at få indsat en DOCTYPE - http://www.web-dev.dk/post/2009/06/05/DOCTYPE-og-valid-kode-ens-udseende-i-Internet-Explorer-og-FireFox.aspx og hvis dine eksempler stadig ikke virker så giv et link til hvor vi kan se det eller kom med lidt kode.
Avatar billede jakobdo Ekspert
07. august 2014 - 14:31 #4
Jeg tror du får svært ved at lave noget uden javascript.
Avatar billede kusken Nybegynder
07. august 2014 - 14:54 #5
Det tooltip  jeg henviser til, kan jeg godt få til at fungere ved mouseover på et link og et billede.

Jeg vil gerne have et tooltip ved mouseover på en celle i en tabel - og der hopper kæden af, hvis det skal være ren CSS.

Tooltipster som der bliver henvist til er ellers ret nem at arbejde med. Selv for en som mig.
Avatar billede jakobdo Ekspert
07. august 2014 - 14:56 #6
Hvad sker der da når du prøver i en tabel ?
Smid et link og lad os kigge med.
jsfiddle eller jsbin evt. ?
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester