Suivez les fils RSS
 

Des livres incontournables pour tout maîtriser

  • CSS avancées - vers HTML5 et CSS3
  • HTML5
  • CSS2
  • PHP5 avanc�
  • Memento MySQL
  • Memento CSS 3
  • Memento XHTML
  • WordPress 3 100% pratique
  • jQuery et jQuery UI
Auteur
Nheavy
#
Citer
43 Posts
Bonjour,

J'aurais voulu mettre des vidéos en slide, j'ai trouvé ce sujet.

Ça marche bien avec un slide mais dés qu'on en met 2, voila ce qui se passe :

http://i49.servimg.com/u/f49/12/59/88/86/proble10.jpg

Il aurait fallu que les 2 bouton "Partie 1" et "Partie 2" de gauche soient sous la vidéo du dessous.

Je ne vois pas comment faire pour que avoir le résultat souhaité, je vous montre le CSS et le Javascript :


<script type="text/javascript" src="../js/easySlider1.7.js"></script>
<script type="text/javascript">$(document).ready(function(){
$("#slider").easySlider({auto:false,continuous:true,numeric:true}); 
$("#slider2").easySlider({auto:false,continuous:true,numeric:true});});</script>


/* Easy Slider */
	
	#slider ul, #slider li, #slider2 ul, #slider2 li {
		margin:0; padding:0;
		list-style:none; }
	#slider2{ margin-top:1em; }
	#slider li, #slider2 li  { 
		width: 916px; height: 600px;
		overflow:hidden; }	
	#prevBtn, #nextBtn, #slider1next, #slider1prev { 
		display:block;
		width:30px; height:77px;
		position:absolute;
		left:-30px; top:71px;
		z-index:1000; }	
	#nextBtn, #slider1next{ left:696px; }														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px; height:77px;
		background:url(../images/btn_prev.gif) no-repeat 0 0; }	
	#nextBtn a, #slider1next a{ background:url(../images/btn_next.gif) no-repeat 0 0; }	
		
	/* numeric controls */	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#controls li{
		margin:0 10px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:28px;
		line-height:28px;
		}
	ol#controls li a{
		float: left;
		height: 28px;
		line-height: 28px;
		border: 1px solid #FFFFFF;
		background: #E9E9E9;
		color: #555555;
		padding: 0 10px;
		text-decoration: none;
		}
	ol#controls li.current a{
		background: #B2B2B2;
		color: #FFFFFF;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}


Est-ce faisable ?
Modifié par Nheavy (21 Feb 2012 - 17:17)

^
Nheavy
#
Citer
43 Posts
Je me suis débrouillé autrement, on peut considérer le sujet comme résolu.

^