Float Up Effect Using CSS3

Nigel Fernandes

10y904Code

Float Up Effect Using CSS 3.

HTML:

<div class="dv">
  Your HTML Code here !
</div>

CSS:

Change below position details as required by you.

.dv {
    position: fixed;
    bottom: 18%;
    left: 50%;
    width: 35%;
    animation-name: aFloatUpEffect;
    animation-duration: 2s;
    animation-timing-function: ease;
}

@keyframes aFloatUpEffect {
    from {
        bottom: 10%;
        opacity:0;
    }

    to {
        bottom: 18%;
        opacity:1;
    }
}