0
誰かがCSSジッタを取り除く方法を教えてくれますか?ここアニメーションのCSSジッタを取り除く
HTML:ここ
<div class="carousel-inner">
<div class="item">
</div>
</div>
CSS:ここ
.carousel-inner {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh;
}
.item {
background-image: url(https://images.unsplash.com/photo-1462834026679-7c03bf571a67?dpr=1&auto=format&fit=crop&w=1500&h=989&q=80&cs=tinysrgb&crop=);
background-position: right bottom;
background-size: 100% 100%;
animation: wdszoom0 5s linear 0s infinite alternate;
position: absolute;
height: 100%;
width: 100%;
display: block;
top: 0;
bottom: 0;
overflow-x: hidden;
}
@-webkit-keyframes wdszoom0 { 100% { background-size: 120% 120%; }}
フィドルは: https://jsfiddle.net/kybernaut/zkzod6wh/2/
私はこれとそれを読みましたが、私を助けていない:
ありがとう、私はそれをトランスフォームとして行うことを考えていませんでした;) –
しかし、コンテンツの全体ではなくアイテムの背景にのみ適用したいのですが? –
次に、アニメーション化できるラッパーがあると思って、コンテンツを残しておくといいでしょう。:) –