Salut,
Ca doit donner un ti'script comme çà...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Exemple</title>
<style type="text/css" media="screen, projection">/*<![CDATA[*/
#exemple { width: 200px; background-color: #DF0; overflow: hidden; }
/*]]>*/</style>
<script type="text/javascript">//<![CDATA[
var oO =
{
// Test de passage d'un argument
_Test:
function()
{
var iI = arguments.length - 1;
for(iI; iI >= 0; iI--) if(!arguments[iI]) return false;
return true;
},
// Ajout d'une action sur un événement
_Connect:
function(oElem, sEvType, fn, bCapture)
{
oElem.addEventListener ?
oElem.addEventListener(sEvType, fn, bCapture):
oElem.attachEvent ?
oElem.attachEvent('on' + sEvType, fn):
oElem['on' + sEvType] = fn;
},
// Méthode d'agrandissement et de rétrécissement progressif d'un conteneur
_Deroule:
function(id, initHeight, finalHeight, interval)
{
// Identification de l'objet
var oElem = document.getElementById(id);
if(!oElem) return;
// Contrôle des valeurs de variables
if(typeof(initHeight || finalHeight || interval) != 'number') return false;
// Contrôle d'éxécution de la méthode
if(oElem.movement) clearTimeout(oElem.movement);
// Initialisation des paramètres
if( !oElem.style.height ) oElem.style.height = parseInt(initHeight) + 'px';
var iDimY = parseInt(oElem.style.height);
// Condition de fin de la méthode
if(iDimY == finalHeight) return true;
// Conditions d'incrémentation et décrémentation
if(iDimY < finalHeight)
{
var dist = Math.ceil((finalHeight - iDimY)/10);
iDimY = iDimY + dist;
}
if(iDimY > finalHeight)
{
var dist = Math.ceil((iDimY - finalHeight)/10);
iDimY = iDimY - dist;
}
oElem.style.height = iDimY + 'px';
// Répétition de la méthode
var repeat = "oO._Deroule('" + id + "'," + initHeight + "," + finalHeight + "," + interval + ")";
oElem.movement = setTimeout(repeat, interval);
return true;
},
// Méthode de chargement
_Load:
function()
{
var oDiv = document.getElementById('exemple');
var iDivHeight = oDiv.offsetHeight;
oO._Deroule('exemple', 0, iDivHeight, 30);
}
};
// Lancement du script
oO._Test(document.getElementById)?
oO._Connect(window, 'load', oO._Load, false):
false;
//]]></script>
</head>
<body>
<p id="exemple">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.</p>
</body>
</html>
Modifié par koala64 (30 Oct 2006 - 19:17)
)