|
|
| Line 1: |
Line 1: |
| | <html> | | <html> |
| - | <script> | + | <script type="text/javascript"> |
| - | alert("coucou");
| + | $(document).ready( |
| - | var DDSPEED = 10;
| + | function(){ |
| - | var DDTIMER = 15;
| + | $("ul.subnav").parent().find("> a").append("<span> ↓</span>"); |
| | + | $("ul.topnav li").hover( |
| | + | function() { |
| | + | // Hover over |
| | + | $(this).parent().find("ul.subnav").hide(); |
| | + | $(this).find("ul.subnav").show(); |
| | + | // Hover out |
| | + | $(this).hover( |
| | + | function() { |
| | + | }, |
| | + | function(){ |
| | + | $(this).find("ul.subnav").hide(); |
| | + | } |
| | + | ); |
| | + | }, |
| | + | function(){ |
| | + | $(this).find("ul.subnav").hide(); |
| | + | } |
| | | | |
| - | // main function to handle the mouse events //
| + | ); |
| - | function ddMenu(id,d){
| + | } |
| - | var h = document.getElementById(id + '-ddheader');
| + | ); |
| - | var c = document.getElementById(id + '-ddcontent');
| + | |
| - | clearInterval(c.timer);
| + | |
| - | if(d == 1){
| + | |
| - | clearTimeout(h.timer);
| + | |
| - | if(c.maxh && c.maxh <= c.offsetHeight){return}
| + | |
| - | else if(!c.maxh){
| + | |
| - | c.style.display = 'block';
| + | |
| - | c.style.height = 'auto';
| + | |
| - | c.maxh = c.offsetHeight;
| + | |
| - | c.style.height = '0px';
| + | |
| - | }
| + | |
| - | c.timer = setInterval(function(){ddSlide(c,1)},DDTIMER);
| + | |
| - | }else{
| + | |
| - | h.timer = setTimeout(function(){ddCollapse(c)},50);
| + | |
| - | }
| + | |
| - | }
| + | |
| - | | + | |
| - | // collapse the menu //
| + | |
| - | function ddCollapse(c){
| + | |
| - | c.timer = setInterval(function(){ddSlide(c,-1)},DDTIMER);
| + | |
| - | }
| + | |
| - | | + | |
| - | // cancel the collapse if a user rolls over the dropdown //
| + | |
| - | function cancelHide(id){
| + | |
| - | var h = document.getElementById(id + '-ddheader');
| + | |
| - | var c = document.getElementById(id + '-ddcontent');
| + | |
| - | clearTimeout(h.timer);
| + | |
| - | clearInterval(c.timer);
| + | |
| - | if(c.offsetHeight < c.maxh){
| + | |
| - | c.timer = setInterval(function(){ddSlide(c,1)},DDTIMER);
| + | |
| - | }
| + | |
| - | }
| + | |
| - | | + | |
| - | // incrementally expand/contract the dropdown and change the opacity //
| + | |
| - | function ddSlide(c,d){
| + | |
| - | var currh = c.offsetHeight;
| + | |
| - | var dist;
| + | |
| - | if(d == 1){
| + | |
| - | dist = (Math.round((c.maxh - currh) / DDSPEED));
| + | |
| - | }else{
| + | |
| - | dist = (Math.round(currh / DDSPEED));
| + | |
| - | }
| + | |
| - | if(dist <= 1){
| + | |
| - | if(d == 1){
| + | |
| - | dist = 1;
| + | |
| - | }
| + | |
| - | }
| + | |
| - | c.style.height = currh + (dist * d) + 'px';
| + | |
| - | c.style.opacity = currh / c.maxh;
| + | |
| - | c.style.filter = 'alpha(opacity=' + (currh * 100 / c.maxh) + ')';
| + | |
| - | if((currh < 2 && d != 1) || (currh > (c.maxh - 2) && d == 1)){
| + | |
| - | clearInterval(c.timer);
| + | |
| - | }
| + | |
| - | }
| + | |
| | </script> | | </script> |
| | </html> | | </html> |
"
