Défilement des images (slide)

**fidbell84** · 29/05/2015, 17h09

Bonjour,

je veux faire des défilement des images (voir la photo) Nom : image_def.png
Affichages : 132
Taille : 19,0 Ko

Pour le moment tce que j'ai arrivé à le faire ces mettres dans une liste 4 images:

voila mon code:

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
<div class="adv-item2">
    <div class="part">
        <img width="30%" height="100%" src="img/home/image1.jpg" />
    </div>
    <div class="part">
        <img width="30%" height="100%" src="img/home/image2.png" />
    </div>
    <div class="part">
        <img width="30%" height="100%" src="img/home/image3.jpg" />
    </div>
    <div class="part">
        <img width="30%" height="100%" src="img/home/image4.jpg" />
    </div>
</div>

Est que j'utilise bootstrap ou qu'est j'utilise pour que je dois avoir la meme image ci-dessus.

Invité · 29/05/2015, 23h41

Bonjour,

On trouve un tas de sliders gratuits en cherchant un peu...

**NoSmoking** · 30/05/2015, 14h27

Bonjour,

j'ai arrivé à le faire ces mettres dans une liste 4 images:

il ne s'agit pas vraiment d'une LISTE dans ton code

**fidbell84** · 12/06/2015, 13h09

Voila mon code est toujours non fonctionnels,

Code :

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
<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet" type="text/css" />
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
	<script>
		$(document).ready(function(){
		  $('.slider8').bxSlider({
			mode: 'vertical',
			slideWidth: 300,
			minSlides: 2,
			slideMargin: 10
		  });
		});
	</script>
</head>
<body>
 
<div class="slider8">
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar1"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar2"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar3"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar4"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar5"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar6"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar7"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar8"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar9"></div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar10"></div>
</div>
 
</body>
</html>