I’ve just been experimenting with a CSS tooltip that fades in with CSS3’s transitions. I was going for a tooltip effect that when you hover a link, the tooltip appears, but fades in using only CSS3.
I’ve got it working up to a point, but for some reason, when I hover over where it’s meant to be, it activates, even though it’s initally positioned left:-999px;.
So basically, what am I doing wrong/is what I was going for possible? (Note I don’t want to do anything with JS/JQuery, was just curious to see if I could do it in CSS)
You can see and play with it here.
Your
spanis still in thedocumentflow.You can remove it by setting its
displaytonone, as the comment above suggests, or setting itspositiontoabsolute, which seems to be what you were getting at to hide it off the left edge of the screen.