Bonjour à tous,
Je tente de mettre un slider dans mon site, à regarder les CSS, je ne vois pas de conflit mais la <div> est comme inexistante.
J'ai bien mis les scripts et les fichiers sources, mais toujours rien.
Leet les CSS :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46 <div class="parallax"> <img src="img/paris.jpg" alt="Paris" data-parallax='{"y": 230}'/> <p>Paris est magique</p> </div> <div class="slider-wrapper default"> <div id="slider"> <a href="http://500px.com/photo/47412316" target="_blank"> <img src="../resources/images/1.jpg" class="bg" /> </a> <a href="http://500px.com/photo/39845938" target="_blank"> <img src="../resources/images/2.jpg" class="bg" /> </a> <a href="http://500px.com/photo/43565628" target="_blank"> <img src="../resources/images/3.jpg" class="bg" /> </a> <a href="http://500px.com/photo/47412316" target="_blank"> <img src="../resources/images/1.jpg" class="bg" /> </a> <a href="http://500px.com/photo/39845938" target="_blank"> <img src="../resources/images/2.jpg" class="bg" /> </a> <a href="http://500px.com/photo/43565628" target="_blank"><img src="../resources/images/3.jpg" class="bg" /> </a> <a href="http://500px.com/photo/47412316" target="_blank"> <img src="../resources/images/1.jpg" class="bg" /> </a> <a href="http://500px.com/photo/39845938" target="_blank"> <img src="../resources/images/2.jpg" class="bg" /> </a> <a href="http://500px.com/photo/43565628" target="_blank"> <img src="../resources/images/3.jpg" class="bg" /> </a> <a href="http://500px.com/photo/47412316" target="_blank"> <img src="../resources/images/1.jpg" class="bg" /> </a> <a href="http://500px.com/photo/39845938" target="_blank"> <img src="../resources/images/2.jpg" class="bg" /> </a> <a href="http://500px.com/photo/43565628" target="_blank"> <img src="../resources/images/3.jpg" class="bg" /> </a> </div> </div>
C'est pourtant un slider tout simple. Si quelqu'un a une idée...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7 .slider-wrapper{ margin: auto; max-width: 700px; height: auto; position: absolute; } .slider-wrapper.default>div{display:none}.slider-wrapper.default>div #slides{font-weight:400;color:white;line-height:normal}.slider-wrapper.default>div #slides img{border:0}.slider-wrapper.default>div #slides>a{line-height:0px}.slider-wrapper.default>div #slides h1,.slider-wrapper.default>div #slides h2,.slider-wrapper.default>div #slides h3,.slider-wrapper.default>div #slides h4{padding:1% 3% 1% 3%;color:#000;background-color:#ffffff;line-height:normal;text-align:center}.slider-wrapper.default>div #slides span,.slider-wrapper.default>div #slides p{line-height:normal}.slider-wrapper.default>div .social{position:absolute;top:4%;left:3%;z-index:10000}.slider-wrapper.default>div .social div{float:left;margin-right:10px}.slider-wrapper.default>div #bullets{height:10px;position:absolute;top:4%;right:3%;z-index:10000}.slider-wrapper.default>div #bullets .bullet{min-height:12px;min-width:12px;border-radius:6px;margin-left:5px;float:left;cursor:pointer;background-color:#b4b4b4;background-color:rgba(255,255,255,0.6)}.slider-wrapper.default>div #bullets .bullet:hover{background-color:#fff}.slider-wrapper.default>div #bullets .bullet.selected{background-color:#fff}.slider-wrapper.default>div #left{position:absolute;width:47px;height:47px;background-image:url(img/arrow.png);left:5%;top:50%;margin-top:-24px;z-index:999999;cursor:pointer}.slider-wrapper.default>div #right{position:absolute;width:47px;height:47px;background-image:url(img/arrow.png);background-position:right top;right:5%;top:50%;margin-top:-24px;z-index:999999;cursor:pointer}
Merci et bonne journée,
dh
Partager