0

これが Chrome では機能するのに Firefox では機能しない理由を理解するのに苦労しています。

私のコード:

#header3{
    background: url(/images/mynecraft/clouds3.png) repeat-x center 20px;
    -webkit-animation-name:cloud-crawl-header3;
    -webkit-animation-duration: 120s;
    -webkit-animation-timing-function:linear;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-name:cloud-crawl-header3;
    -moz-animation-duration:120s;
    -moz-animation-timing-function:linear;
    -moz-animation-iteration-count:infinite;
}
@-webkit-keyframes cloud-crawl-header3{
        from{background-position: -100% 20px, center top}to{background-position: 100% 20px, center top}
}
@-moz-keyframes cloud-crawl-header3{
        from{background-position: -100% 20px, center top}to{background-position: 100% 20px, center top}
}

それの何が問題なのですか？

4

1 に答える 1

1

なぜbackground-positionこのような2 組の位置があるの-100% 20px, center topですか?

私はそれがあるべきだと思います：

@-webkit-keyframes cloud-crawl-header3 {
    from {
        background-position: -100% 20px;
    }
    to { 
        background-position: 100% 20px;
    }
}

@-moz-keyframes cloud-crawl-header3 {
    from {
        background-position: -100% 20px;
    }
    to { 
        background-position: 100% 20px;
    }
}
于 2012-07-28T15:37:15.410 に答える