Autor Tópico: [ajuda] Simple Javascript Accordions E Lightbox  (Lida 1224 vezes)

putu

  • Membro Pro
  • Geek
  • ****
  • Mensagens: 235
  • Karma: 0
    • Ver Perfil
[ajuda] Simple Javascript Accordions E Lightbox
« em: Novembro 22, 2008, 08:43:19 »
Boas pessoal... é o seguinte eu estou a usar o script "Simple Javascript Accordions" e o "LightBox", mas eu gostava de alterar umas pequenas coisas, mas não estou a conseguir..... a primeira coisa é que onde está a barra azul, esta não se abra logo quando se abre a página, queria que só se abrisse quando se carrega-se na barra e quando se carrega-se outra vez esta se fecha-se..... outra coisa que não está a dar é a lightbox, devido a um pedaço do código do Simple Javascript Accordions, e se lhe tiro esse pedaço de código depois já não funciona bem o outro....

Index.html

Código: [Seleccione]
<!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>Simple Javascript Accordions - by www.dezinerfolio.com</title>
<link rel="stylesheet" href="lightbox/screen.css" type="text/css" media="screen" />
<link rel="stylesheet" href="lightbox/lightbox.css" type="text/css" media="screen" />


<style type="text/css">
* {
    margin:0;
    padding:0;
    list-style:none;
}
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin:10px;
}

#basic-accordian{
    border:5px solid #EEE;
    padding:5px;
    width:350px;
    position:absolute;
    left:50%;
    top:50%;
    margin-left:-175px;
    z-index:2;
    margin-top:-100px;
}

.accordion_headings{
    padding:5px;
    background:#99CC00;
    color:#FFFFFF;
    border:1px solid #FFF;
    cursor:pointer;
    font-weight:bold;
}

.accordion_headings:hover{
    background:#00CCFF;
}

.accordion_child{
    padding:15px;
    background:#EEE;
}

.header_highlight{
    background:#00CCFF;
}

</style>
<script type="text/javascript" src="http://www.webtuga.com/forum/lightbox/lightbox.js" ></script>
<script type="text/javascript" src="http://www.webtuga.com/forum/accordian.pack.js" ></script>
</head>
<body onload="new Accordian('basic-accordian',5,'header_highlight');">


<div id="basic-accordian" ><!--Parent of the Accordion-->
      <p><a href="img/orbital_fm.jpg" rel="lightbox" title="Orbital FM!"><img src="http://www.webtuga.com/forum/img/orbital_fm_pek.jpg"  width="300" height="300" alt="the handstand incident" border="0"/></a></p>

<!--Start of each accordion item-->
  <div id="test-header" class="accordion_headings header_highlight">Home</div><!--Heading of the accordion ( clicked to show n hide ) -->
  
  <!--Prefix of heading (the DIV above this) and content (the DIV below this) to be same... eg. foo-header & foo-content-->

  <div id="test-content"><!--DIV which show/hide on click of header-->
  
      <!--This DIV is for inline styling like padding...-->
    <div class="accordion_child">
        <p>&nbsp;</p>
        <p>          <b><i>Características:</i></b></p>
        <p>
            <br />
             <b>Name:</b> Orbital FM<br />
          <b>Categoria:</b> Web Design<br />
          <b>Design:</b> Photoshop<br />
          <b>Tecnology:</b> Css, Html, Php, Flash<br />
          <b>Date:</b> November, 2008<br />
    </div>
    
  </div>
<!--End of each accordion item-->







</body>
</html>



Código que faz com que a lightbox não funcione:

Código: [Seleccione]
<body [b]onload="new Accordian('basic-accordian',5,'header_highlight');"[/b]>

Se eu tirar esse pedaço que está a negrito a lightbox funciona mas depois o outro script não....



Para poderem ver o demo aqui deixo:

Demo


Desde já agradeço ajudas