Can I use transition/animations on pseudo elements?

I have made a tooltip that appears upon hovering an icon.

Can i use transitions to fade in the tooltip? Because I can’t get in to work.

Here is my code:

    .tooltip{
        display: inline;
        position: relative;
    }
    .tooltip:after{
        opacity: 0;
       transition: opacity .25s ease-in-out;
       -moz-transition: opacity .25s ease-in-out;
       -webkit-transition: opacity .25s ease-in-out;
    }
    .tooltip:hover:after{
        background: #555;
        bottom: 60px;
        color: #fff;
        content: attr(data-title);
        left: -110px;
        padding: 10px 15px;
        position: absolute;
        z-index: 98;
        width: 220px;
        font-size: .7em;
        letter-spacing: 1px;
        text-align: center;
        opacity: 1;
    }

Transitions for pseudo elements only work in the latest versions of Chrome 27+