Partage

defilement d'images pour debutant

comment faire defiler des images

14 avril 2018 à 15:33:42

Bonjours a tous 

j'aimerai savoir comment faire defiler des images a la suite ?

merci d'avance.

Vous êtes demandeur d'emploi ?
Sans diplôme post-bac ?

Devenez Développeur web junior

Je postule
Formation
certifiante
Financée
à 100%
Staff 14 avril 2018 à 15:47:46

Bonjour,

recherche "carrousel" ou "slider" sur le net, tu auras des dizaines de propositions.

Évite cependant les sites qui veulent te faire installer un logiciel local (genre Wowslider), ce n'est pas fiable.

Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
14 avril 2018 à 16:50:56

Dacord merci beaucoup je vais essayer
15 avril 2018 à 12:07:48

Bootstrap propose des carrousel tout fait :-)

+ d'infos : https://openclassrooms.com/courses/prenez-en-main-bootstrap/les-plugins-jquery-2#/id/r-2730064

-
Edité par Laurent Cipicchia 15 avril 2018 à 12:08:04

Donne moi ton avis sur ma Reconversion professionnel en Développeur Web ----- Rejoins moi sur LinkedIn
15 avril 2018 à 12:29:19

Bonjour,

Un exemple basique en pur CSS:

http://jsbin.com/tovofe/5/edit?html,css,output

<div class="contener_slideshow">

<div class="contener_slide">

<div class="slid_1"><img src="http://lorempicsum.com/nemo/950/600/1"></div>
<div class="slid_2"><img src="http://lorempicsum.com/futurama/950/600/2"></div>
<div class="slid_3"><img src="http://lorempicsum.com/futurama/950/600/3"></div>

</div>

</div>

CSS

.contener_slideshow {
	width:950px;
	height:600px;
	overflow:hidden;
	position:relative;
  border:12px ridge gold;
}
.slid_1,.slid_2,.slid_3 {
	display:table-cell;
	width:950px;
	height:600px;
}

.contener_slide {
	width:950px;
	height:600px;
	position:absolute;
  display:table;
  animation:anim_slide 9s infinite alternate;
}
@keyframes anim_slide {
	0% {
		left:0px;
	}
	15% {
		left:0px;
	}
	35% {
		left:-950px;
	}
	65% {
		left:-950px;
	}
	85% {
		left:-1900px;
	}
	100% {
		left: -1900px;
	}
}




"La Vérité doit être dite, le monde dût-il en voler en éclats"  (J. G. Fichte)

defilement d'images pour debutant

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown