Bonjour,
Il s'agit de défiler trois DIV avec JQuery Carousel (Lite)! Les 3 DIV contiennent des textes placés en absolu, là c'était difficile de bien positionner le DIV parent dans la page mais j'ai réussi
Le problème sous IE c'est:
- le défilement (on a un DIV complètement vide au départ) ne démarre qu'après quelques temps, après d'autres activités (reduire le browser, regarder un autre onglet, etc)
- les textes sont décalés de quelques pixels vers le bas, le texte le plus bas se situe souvent en dehors du DIV
Il s'agit de défiler trois DIV avec JQuery Carousel (Lite)! Les 3 DIV contiennent des textes placés en absolu, là c'était difficile de bien positionner le DIV parent dans la page mais j'ai réussi
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jcarousellite_1.0.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
jQuery(function() {
jQuery('#nuage-stickers').jCarouselLite({
vertical: true,
hoverPause: true,
visible: 1,
auto: 2000,
speed: 500
});
});
</script>
<div style="width:1000px; margin-left: auto; margin-right: auto; ">
<div style="position:relative;float:left;width:600px;height:130px;border:1px solid black;">
<div class="takerdv" style="position:absolute;top:22px;left:37px;margin: 0 0;"><span style="font-style:oblique;font-size:x-large;">Take </span><span style="font-style:oblique;font-size:xx-large;font-weight:bold">RAKNAL</span></div>
<div class="takerdv" style="position:absolute;top:38px;left:360px;margin: 0 0;"><span style="font-style:oblique;font-size:x-large;">by </span><span style="font-style:oblique;font-size:xx-large;font-weight:bold">Studio</span></div>
<div class="takerdv" style="position:absolute;top:84px;left:166px;margin: 0 0;"><span style="font-style:oblique;font-size:x-large;">dance </span><span style="font-style:oblique;font-size:xx-large;font-weight:bold">floor</span></div>
</div>
<div id="nuage-stickers" style="position:relative;float:left;width:390px;height:130px;border:1px solid black;">
<ul style="list-style-type:none;">
<li>
<div style="position:relative;width:400px;height:130px">
<div style="position:absolute;top:22px;left:50px;">Text1</div>
<div style="position:absolute;top:35px;left:300px;">Text2</div>
<div style="position:absolute;top:50px;left:110px;">Text3</div>
<div style="position:absolute;top:70px;left:60px;">Text4</div>
<div style="position:absolute;top:100px;left:310px;">Text5</div>
</div>
</li>
<li>
<div style="position:relative;width:400px;height:130px">
<div style="position:absolute;top:22px;left:50px;">Text1</div>
<div style="position:absolute;top:35px;left:300px;">Text2</div>
<div style="position:absolute;top:50px;left:110px;">Text3</div>
<div style="position:absolute;top:70px;left:60px;">Text4</div>
</div>
</li>
<li>
<div style="position:relative;width:400px;height:130px">
<div style="position:absolute;top:22px;left:50px;">Text1</div>
<div style="position:absolute;top:35px;left:300px;">Text2</div>
<div style="position:absolute;top:50px;left:110px;">Text3</div>
<div style="position:absolute;top:70px;left:60px;">Text4</div>
</div>
</li>
</ul>
</div>
</div>
</body>
</html>Le problème sous IE c'est:
- le défilement (on a un DIV complètement vide au départ) ne démarre qu'après quelques temps, après d'autres activités (reduire le browser, regarder un autre onglet, etc)
- les textes sont décalés de quelques pixels vers le bas, le texte le plus bas se situe souvent en dehors du DIV