11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour à toutes et tous !!

J'ai un soucis avec cette fonction : http://docs.jquery.com/UI/Effects/Slide

L'effet est bien appliqué mais le souci c'est que l’élément affiché ne s'affiche pas correctement lors de la transition, voici le site en question, vous pourrez constater la chose lors du survol des onglets "en fixed" sur le côté : http://www.mo-web-creation.com/showroom/jm/

L'image "peinture" et "photo" ne sont pas dans les bonnes dimensions lors des transitions, et je n'arrive pas à voir pourquoi ... Smiley decu

Voici le code de la section onglet :

HTML
<section class="section" id="side-tabs">
		<div>
			<a class="left" href="peintures.php" title="Acceder à la Galerie Peinture de Jacques Maillard">
				<img src="design/peinture-tab.jpg" />
			</a>
			<img class="left" alt="Galerie Peintures" src="design/peintures-tab-text.png" />
			<span class="clear"></span>
		</div>
		<hr />
		<div>
			<a class="left" href="photos.php" title="Acceder à la Galerie Photos de Jacques Maillard">
				<img src="design/photo-tab.jpg" />
			</a>
			<img class="left" alt="Galerie PHOTOS" src="design/photos-tab-text.png" />
			<span class="clear"></span>
		</div>
	</section>



JS
$('#side-tabs div a').on( 
{ 	mouseover: function() {
	var parentdiv = $(this).parent('div');
	var tabtext = parentdiv.children('img');	
	$(tabtext).show('slide', { direction: 'left' }, 200);
	},
	mouseout: function() {
	var parentdiv = $(this).parent('div');
	var tabtext = parentdiv.children('img');
	$(tabtext).hide('slide', { direction: 'left' }, 200);
	}
}
);


et le CSS
#side-tabs
{
	display: block;
    left: 0;
    position: fixed;
    top: 15%;
    width: 14%;
}
#side-tabs div
{
	display: block;
	width: 100%;
}
#side-tabs a
{
	width: 40%;
	display: block;
}
#side-tabs a img
{
	width: 100%;
	display: block;
}
#side-tabs img
{
	width: 40%;
	display: none;
}
#side-tabs hr
{
	height: 2em;
	clear: both;
}


Je vous remercie d'avance pour le coup de main et je souhaite une Bonne soirée à tous !!

MICKAEL