Efeito Sanfona - não funciona

Rodrigo26 · Junho 13, 2011

<html>
<head><title>Exemplo</title>
<script type='text/javascript' src='core.js'></script>
<script type='text/javascript'>
var Accordion = 
{
   init: function()
   {
      var accordions = Core.getElementsByClass("accordion");
      for(var i = 0; i < accordions.length; i++)
      {
         var folds = accordions[i].childNodes;
         for( var j = 0; j < folds.length; j++)
         {
            if(folds[j].noteType == 1)
            {
               Accordion.collapse(folds[j]);
               var foldLinks = folds[j].getElmentsbyTagName("a");
               var foldTitleLink = foldLinks[0];
               Core.addEventListener(foldTitleLink, "click", Accordion.clickListener);
               for(var k = 1; foldLinks.length; k++)
               {
                  Core.addEventListener(foldLinks[k], "focus", Accordion.focusListener);
               }
            }
         }
         if(location.hash.length > 1)
         {
            var activeFold = document.getElementById(location.hash.substring(1));
            if(activeFold && activeFold.parentNode == accordions[i])
            {
               Accordion.expand(activeFold);
            }
         }
      }
   },
   
   collapse: function(fold)
   {
      Core.removeClass(fold, "expanded");
      Core.addClass(fold, "collapsed");
   },
   
   collapseAll: function(accordion)
   {
      var folds = accordion.childNodes;
      for(var i = 0; i < folds.length; i++)
      {
         if(folds[i].nodeType == 1)
         {
            Accordion.collapse(folds[i]);
         }
      }
   },
   
   expand: function(fold)
   {
      Accordion.collapseAll(fold.parentNode);
      Core.removeClass(fold,"collapsed");
      Core.addClass(fold, "expanded");  
   },
   
   clickListener: function(event)
   {
      var fold = this.parentNode.parentNode;
      if(Core.hasClass(fold, "collapsed"))
      {
         Accordion.expand(fold);
      }
      else
      {
         Accordion.collapse(fold);
      }
      Core.preventDefault(event);
   },
   
   focusListener: function(event)
   {
      var element = this;
      while(element.parentNode)
      {
         if(Core.hasClass(element.parentNode, "accordion"))
         {
            Accordion.expand(element);
            return;
         }
         element = element.parentNode;
      }
   }
};

Core.start(Accordion);
</script>

<style type='text/css'>
ul.accordion li.collapsed * {  
  position: absolute;  
  left: -9999px;  
}  

ul.accordion li.collapsed h2, ul.accordion li.expanded h2,
ul.accordion li.collapsed h2 a:link,
ul.accordion li.collapsed h2 a:visited,
ul.accordion li.expanded h2 a:link,
ul.accordion li.expanded h2 a:visited{
position: static;
}

ul.accordion li.collapsed h2 a:hover,
ul.accordion li.collapsed h2 a:focus,
ul.accordion li.collapsed h2 a:active,
ul.accordion li.expanded h2 a:link,
ul.accordion li.expanded h2 a:visited {
background-color:#F0A000;
}
</style>
</head>
<body>
<ul class='accordion'>
  <li id="archer">
     <h2><a href="#archer">Jonathan Archer</a></h2>
     <p>Vessel registry: NX-01</p>
     <p>Assumed command: 2151</p>
     <div class='links'>
        <h3>Profiles</h3>
        <ul>
           <li><a href="...">Memory Alpha</a></li>
           <li><a href="...">Wikipedia</a></li>
        </ul>
     </div>
  </li>
  <li id="pike">
     <h2><a href="#pike">Pike</a></h2>
     <p>Vessel registry: NX-01</p>
     <p>Assumed command: 2151</p>
     <div class='links'>
        <h3>Profiles</h3>
        <ul>
           <li><a href="...">Memory Alpha</a></li>
           <li><a href="...">Wikipedia</a></li>
        </ul>
     </div>
  </li>
</ul>
</body>
</html>

Grato,

Entrar

Efeito Sanfona - não funciona

Pergunta

Rodrigo26

Link para o comentário

Compartilhar em outros sites

0 respostass a esta questão

Posts Recomendados

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades