Diaporama javascript et display none

Fermé
nikouette - Modifié par nikouette le 15/12/2011 à 14:58
Bonjour tout le monde !
j'ai un pti soucis de javascript qui ne se lance pas ... j'ai mixé plusieurs script : l'un agit sur des menus type "déroulant" (display block ou none) et l'autre crée un diaporama dans l'une de ces div.
- le scipt de diaporama fonctionne super quand il n'est pas dans une div - ça c bon -
- en display "block", il marche aussi - mais je veux que la div qui le contient soit cachée au démarrage du site
- en display none (comme je le voudrais) et ben ça marche po...snif .. ...
bon, j'apprend le javascript..mais c long ;) et meme apres avoir cherché partout (meme à la fnac dans les bouquins....pff !), pas moyen de trouver ce qui cloche !
bon, ok le + simple c'est de vous montrer les script peut être :)
merci d'avance pour l'aide !!!!
++



HTML --------------------------


<div id="menu">
<div class="menu" id="menu1" onclick="afficheMenu(this);"> <a href="#">partie 1</a></div>
<div id="sousmenu1" style="display:none">
<div class="sousmenu">
<div id="wrapper">
<div>
<div class="sliderbutton"><img src="images/flchg.gif" width="50" height="50" alt="Previous" onclick="slideshow.move(-1)" /></div>
<div id="slider">
<ul>
<li id="content"><img src="photos/01.jpg" width="600" height="600" alt="Image 1" /></li>
<li><img src="photos/02.jpg" width="600" height="600" alt="Image 1" /></li>
<li><img src="photos/03.jpg" width="600" height="600" alt="Image 2" /></li>
<li><img src="photos/04.jpg" width="600" height="600" alt="Image 3" /></li>
<li><img src="photos/05.jpg" width="600" height="600" alt="Image 4" /></li>
<li><img src="photos/06.jpg" width="600" height="600" alt="Image 5" /></li>
<li><img src="photos/07.jpg" width="600" height="600" alt="Image 6" /></li>
<li><img src="photos/08.jpg" width="600" height="600" alt="Image 7" /></li>
</ul>
</div>
<div class="sliderbutton"><img src="images/flchd.gif" width="50" height="50" alt="Next" onclick="slideshow.move(+1)" /></div>
</div>
<ul id="pagination" class="pagination">
<li onclick="slideshow.pos(0)">1</li>
<li onclick="slideshow.pos(1)">2</li>
<li onclick="slideshow.pos(2)">3</li>
<li onclick="slideshow.pos(3)">4</li>
<li onclick="slideshow.pos(4)">5</li>
<li onclick="slideshow.pos(5)">6</li>
<li onclick="slideshow.pos(6)">7</li>
<li onclick="slideshow.pos(7)">8</li>
</ul>
</div> <!--//end wrapper-->

<script type="text/javascript">
var slideshow=new
TINY.slider.slide('slideshow',{
id:'slider', // ID of the parent slideshow div
auto:3, // Seconds to auto-advance, defaults to disabled
resume:true, // Resume auto after interrupted, defaults to false
vertical:false, // Direction, defaults to false
navid:'pagination', // Optional ID of direct navigation UL
activeclass:'current', // Class to set on the current LI
position:0 // Initial slide position, defaulting to index 0
});
</script>

</div>
</div>

JAVASCRIPT ----------------------


var TINY={};

function T$(i){return document.getElementById(i)}
function T$$(e,p){return p.getElementsByTagName(e)}

TINY.slider=function(){
function slide(n,p){this.n=n; this.init(p)}
slide.prototype.init=function(p){
var s=T$(p.id), u=this.u=T$$('ul',s)[0], c=T$$('li',u), l=c.length, i=this.l=this.c=0;
if(p.navid&&p.activeclass){this.g=T$$('li',T$(p.navid)); this.s=p.activeclass}
this.a=p.auto||0; this.p=p.resume||0; this.v=p.vertical||0; s.style.overflow='hidden';
for(i;i<l;i++){if(c[i].parentNode==u){this.l++}}
if(this.v){;
u.style.top=0; this.h=p.height||c[0].offsetHeight; u.style.height=(this.l*this.h)+'px'
}else{
u.style.left=0; this.w=p.width||c[0].offsetWidth; u.style.width=(this.l*this.w)+'px'
}
this.pos(p.position||0,this.a?1:0)
},
slide.prototype.auto=function(){
this.u.ai=setInterval(new Function(this.n+'.move(1,1)'),this.a*1000)
},



slide.prototype.move=function(d,a){
var n=this.c+d, i=d==1?n==this.l?0:n:n<0?this.l-1:n; this.pos(i,a)
},
slide.prototype.pos=function(p,a){
clearInterval(this.u.ai); clearInterval(this.u.si);
var o=this.v?parseInt(this.u.style.top):parseInt(this.u.style.left),
t=this.v?p*this.h:p*this.w, d=t>Math.abs(o)?1:-1; t=t*-1; this.c=p;
if(this.g){for(var i=0;i<this.l;i++){this.g[i].className=i==p?this.s:''}}
this.u.si=setInterval(new Function(this.n+'.slide('+t+','+d+','+a+')'),20)
},
slide.prototype.slide=function(t,d,a){
var o=this.v?parseInt(this.u.style.top):parseInt(this.u.style.left);
if(o==t){
clearInterval(this.u.si); if(a||(this.a&&this.p)){this.auto()}
}else{
var v=o-Math.ceil(Math.abs(t-o)*.15)*d+'px';
this.v?this.u.style.top=v:this.u.style.left=v
}
};
return{slide:slide}
}();