XF 1.5 How to make an animation on my header?

Dylan V

Well-known member
#6
Add this in EXTRA.css:
Code:
#logoBlock
{
    animation: bannerAnimate 150s infinite linear;
    -webkit-animation: bannerAnimate 150s infinite linear;
    -moz-animation: bannerAnimate 150s infinite linear;
    -o-animation: bannerAnimate 150s infinite linear;
}

@keyframes bannerAnimate
{
    from
    {
        background-position: 0;
    }
   
    to
    {
        background-position: -1980px;
    }
}

@-webkit-keyframes bannerAnimate
{
    from
    {
        background-position: 0;
    }
   
    to
    {
        background-position: -1980px;
    }
}

@-moz-keyframes bannerAnimate
{
    from
    {
        background-position: 0;
    }
   
    to
    {
        background-position: -1980px;
    }
}

@-o-keyframes bannerAnimate
{
    from
    {
        background-position: 0;
    }
   
    to
    {
        background-position: -1980px;
    }
}
Change the 1980 with the resolution of your image.
 
Top