28220 sujets

CSS et mise en forme, CSS3

[Résolu]Div et overflow hidden sous IE

Bonjour,

Voila j'ai un ptit problème avec le overflow hidden de IE.

J'aimerais avoir un contenu plus grand que son conteneur
et scroller le contenu avec une barre de scrollbar tres personnalisé.

Donc j'ai pensé a faire un div avec un overflow hidden qui contient
un div (que je bouge pour le scrolling). Ce dernier div contenant
du texte/image

voila le code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
.toto
{
	overflow:hidden;
	height:360px;
}
</style>
<script language="JavaScript">
	var mydiv;
	var timerID = 0;
	var top = 0;
	var iter = 0;
	var step = -20;
	
	function load()
	{
		mydiv = document.getElementById("test");
		timerID = setTimeout("timerEvent()", 50);
	}
	
	function timerEvent()
	{		
		iter++;
		top += step;
		mydiv.style.top = top + 'px';
		clearTimeout(timerID);
		if (iter < 6)
			timerID = setTimeout("timerEvent()", 50);
		else
			iter = 0;
	}
</script>
</head>
<body>
<div>
	Test Gallery
</div>
<div style="float:left;overflow:hidden;">
	<div id="test" style="position:relative;height:360px">
	<img src="http://www.google.fr/intl/fr_fr/images/logo.gif" /><br />
	<img src="http://www.google.fr/logos/bastilleday05.gif" /><br />
	<img src="http://www.google.fr/logos/mothers_day05.gif" /><br />
	<img src="http://www.google.fr/logos/earthday05.gif" /><br />
	<img src="http://www.google.fr/logos/da_vinci.gif" /><br />
	<img src="http://www.google.fr/logos/van_gogh.gif" /><br />
	</div>
</div>
<div style="float:left;">
	<input type="button" onclick="step = -20;load()" name="Up" value="Up" /><br />
	<input type="button" onclick="step = 20;load()" name="Down" value="Down" />
</div>
</body>
</html>


Sous FireFox pas de probleme ... sous IE le div se deplace mais ce qui
depasse ne se cache pas Smiley fache .

Je sais qu'en retirant le doctype transitional sa passe ... Mais ce n'est pas
mon interet et donc je refuse cette solution (désolé).

J'aurais aimé savoir si quelqu'un connaissait une solution à ce probleme ?

Merci.

--
Yann
Modifié par kYann (07 Aug 2006 - 02:05)
J'ai demandé a un expert css alias DJP Smiley lol !

Et en faite il suffit de rajouter un position:relative au div sur lequel
je met la propriété overflow ...
Modifié par kYann (07 Aug 2006 - 02:11)
Sujet clos
Aller à