Insertion de javascript dans html (slide)

**fidbell84** · 02/06/2015, 12h01

Bonjour,

je suis d�butante en JavaAcript, je veux inserer un code javascript dans une page html.

j'ai fais comme ca mais n'est pas fonctionnel.

Voila mon code:

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
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/eventList_style.css">
</head>
<body>
<script>
	$(document).ready(function(){
		$('.slider8').bxSlider({
			mode: 'vertical',
			slideWidth: 300,
			minSlides: 2,
			slideMargin: 10
		  });
		});
	</script>
	<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>

la source de code est http://bxslider.com/examples/carousel-demystified

**Bovino** · 02/06/2015, 13h14

Tu utilises des fonctions jQuery mais tu n'as pas int�gr� jQuery dans ta page, c'est un peu comme si tu achetais du carburant alors que t'as pas de voiture et que tu te demandais pourquoi tu n'arrives pas � conduire...

Comment installer la biblioth�que jQuery ?

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

Voila j'ai ajout� les librairies de bootstrap et celle de jquery mais malgr� �a le code est toujours non fonctionnels:

Vous trouvez ci-dessous mon code:

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>

**LuluHow** · 12/06/2015, 16h24

Peut-�tre que tu devrais t�lecharger bxSlider et l'inclure non?

**SpaceFrog** · 12/06/2015, 16h58

Ton slider est un plugin jquery ... si tu le charges pas il ne risque pas de fonctionner
Sur le fiddle ci dessous il est charg� depuis un cdn ... (cf external ressources)
http://jsfiddle.net/ex7pbtha/

Insertion de javascript dans html (slide)

jQuery

Vue hybride

Discussions similaires

Partager

Partager