CSSを使用してスライダに背景画像を与える方法はありますか？

コード：ここでCSSを使用してスライダに背景画像を与える方法はありますか？

<html> 
<head> 
    <style> 
    #example1 { 
     background-image: url(img_flwr.gif), url(paper.gif), url(flower.gif); 
     background-position: right bottom, left top; 
     background-repeat: no-repeat, repeat; 
     padding: 100px; 
    } 
    </style> 
</head> 
<body> 
    <div id="example1"> 
    </div> 
</body> 
</html>

は、私は3枚の背景画像すなわちimg_flwr.gif、paper.gif、flower.gifを使用しています。私はCSSを使用してこれらの画像をスライドさせたい。私はこれらのイメージを退色させたくありません。だから、どうすればいい？

出典

2017-03-08 sam orten

これを自分で作成しようとしましたが、 –

CSSはスタイリングだけのため、javascriptを使用するとよいでしょう。 – Jer

複数の背景画像を設定しますか？これを達成するには、 'setInterval'とjQueryのcss http://api.jquery.com/css/を使うべきです –

イメージ要素を作成し、position: absoluteとz-index CSSプロパティを使用して、イメージを別の要素の背後に設定します。次にスライダーをJQueryで作成します。

<html> 
<head> 
    <style> 
#example1 { 
    background-position: right bottom; 
    background-repeat: no-repeat, repeat; 
    padding: 100px; 
    z-index: 10; 

} 
#slider { 
    position: absolute; 
    z-index: 0; 
} 
    </style> 
    </head> 
    <body> 
    <div id="example1"> 

    </div> 
<div id="slider"> 
<img src="flwr.jpg" alt="Paris"> 
<img src="paper.jpg" alt="Paris"> 
<img src="flower.jpg" alt="Paris"> 
    </div> 

<script> 

</script> 



</body> 
</html>

出典

2017-03-08 08:20:18 Nico

CSSを使用してスライダに背景画像を与える方法はありますか？

答えて

関連する問題