Soucis, Slide Show responsive

Bonjour/Bonsoir,

Je viens à vous désespéré de n'avoir trouver la solution alors qu'en temps normal je n'abandonne jamais mais là, mes compétences sont de loin dépassées... Bref.

J'ai crée en m'inspirant d'autres modèles.. un slideshow responsive qui ... Bref voilà les images:

1/ Dans un premier temps un petit cube se forme puis disparait ..

2/ du blanc, donc click sur flèche droite, viens donc l'autre image très rapide et blanc de nouveau:

Merci par Avance ...... ( Je vous évite l'écriture d'autres fichiers .CSS inutiles)

Code ( qui me paraît parfait) :

<div id="showcase-row">
<div class="container">
<div class="row">
<div class="moduletable span12"><div style="display: block; height: 670px;" id="camera-slideshow" class="camera_wrap"><div class="camera_fakehover"><div class="camera_src paused camerastarted">

<div class="camera-item" data-src="v6.jpg">



</div>

<div class="camera-item" data-src="a1.jpg">



</div>

<div class="camera-item" data-src="b6.jpg">



</div>
</div><div class="camera_target"><div class="cameraCont"><div style="visibility: visible; display: block; z-index: 999;" class="cameraSlide cameraSlide_0 cameracurrent"><img data-portrait="" data-alignment="" style="visibility: visible; height: 670px; margin-left: 0px; margin-right: 0px; margin-top: 0px; position: absolute; width: 1132px;" class="imgLoaded" src="b6.jpg" height="670" width="1132"><div style="width: 1132px; height: 670px;" class="camerarelative"></div></div><div style="display: none;" class="cameraSlide cameraSlide_1 cameranext"><img data-portrait="" data-alignment="" style="visibility: visible; height: 670px; margin-left: 0px; margin-right: 0px; margin-top: 0px; position: absolute; width: 1132px;" class="imgLoaded" src="a1.jpg" height="670" width="1132"><div style="width: 1132px; height: 670px;" class="camerarelative"></div></div><div class="cameraSlide cameraSlide_2"><div style="width: 1132px; height: 670px;" class="camerarelative"></div></div><div style="z-index: 1; display: none;" class="cameraSlide cameraSlide_3"><div style="width: 1132px; height: 670px;" class="camerarelative"></div></div></div></div><div class="camera_target_content"><div class="cameraContents"><div style="display: block;" class="cameraContent cameracurrent"><div style="visibility: visible; left: 0px; right: auto;" class="camera_caption moveFromLeft"><div>




<h2>&nbsp;</h2>

</div></div></div><div class="cameraContent"><div style="visibility: hidden;" class="camera_caption moveFromLeft"><div>




<h2>&nbsp;</h2>

</div></div></div><div class="cameraContent"><div style="visibility: hidden;" class="camera_caption moveFromLeft"><div>




<h2>&nbsp;</h2>

</div></div></div></div></div><div class="camera_pie"><canvas style="position: absolute; z-index: 1002; right: 0px; top: 0px; display: none; opacity: 0.8;" height="38" width="38" id="pie_0"></canvas></div><div class="camera_prev"><span></span></div><div class="camera_next"><span></span></div></div><div style="display: none;" class="camera_loader"></div></div>

<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#camera-slideshow').camera({
alignment	 :"center", 
autoAdvance	 : false,	
mobileAutoAdvance	: false, 
barDirection	 : "leftToRight",	
barPosition	 : "bottom",	
cols	 : 2,
easing	 : "easeInOutExpo",
mobileEasing	 : "easeInOutExpo",	
fx	 : "mosaic",	
mobileFx	 : "simpleFade",	
gridDifference	 : 250,	
height	 : "59.18%",	'
imagePath	 : 'images/',	
hover	 : false,	
loader	 : "pie",	
loaderColor	 : "#eeeeee", 
loaderBgColor	 : "#222222", 
loaderOpacity	 : .8,	
loaderPadding	 : 2,	
loaderStroke	 : 7,	
minHeight	 : "200px",	
navigation	 : true,	buttons
navigationHover	 : false,	
mobileNavHover	 : false,	
opacityOnGrid	 : false,	
overlayer	 : false,	
pagination	 : false,
playPause	 : false,	 buttons
pauseOnClick	 : false,	
pieDiameter	 : 38,
piePosition	 : "rightTop",	
portrait	 : true, 
rows	 : 4,
slicedCols	 : 6,	
slicedRows	 : 4,	
slideOn	 : "random",	
thumbnails	 : false,
time	 : 7000,	
transPeriod	 : 1500,	
onEndTransition	 : function() { }
onLoaded	 : function() { }
onStartLoading	 : function() { }
onStartTransition	: function() { }	
});
});
</script> 

Modifié par alzaro (27 Nov 2014 - 22:49)

Bonsoir,

Penses à utiliser les balises de colorisation syntaxique afin de faciliter la lecture de tes sujets.
Il n'est parfois pas très utile de réinventer la roue, à moins que ce ne soit une question d'accomplissement personnel, il existe déjà bon nombre de ressources sur la toile (mots clés : responsive slideshow par exemple)
Pourrais-tu également reformuler ta question, qui, après plusieurs lectures, ne m'apparait toujours pas limpide
Le mieux, ce serait de fournir une page de test en ligne

Résolue Mais infiniment merci pour avoir tisser contact, le genre humain a de l'espoir avec des personnes telle que toi
Modifié par alzaro (29 Nov 2014 - 01:14)