For beary

[KynoYang]

@45kb
Hi, I finally decided to use keyframes because transition animation doesn't work if put it with changing display.

I have tried to set tooltip's display to block in class tooltip-open, then set a timeout to add another classname to do transition things. It worked, but I don't like it.

The other problem is it's hard to add animation when hiding.

[45kb]

Hi, great job! So ... i looked at the code.

Actually to set medium | fast | slow | int , options to the speed the only solution in my mind is:

switch attr.tooltipSpeed { case 'medium': $scope.speed = 0.3; case 'fast': $scope.speed = 0.1; case 'slow': $scope.speed = 0.5; case isNumeric(): $scope.speed = attr.tooltipSpeed; default: $scope.speed = undefined; } 

So now you have the speed as number, you can put it via js or ng-style i prefer js to the tooltip transition.

I am still wondering why we should use display:none, if the tooltip is something like this (before to show it):

.tooltip.hide { position:absolute; z-index:-999; left:-200%; } 

display shouldn't be necessary!?

[KynoYang]

@45kb Yeah, I agree. Display is not the best choice. Setting tooltip out of screen is better.

Also, if you think using js is OK, I'll do it.

[45kb]

@KynoYang awesome! let me know if any trouble ;)