como crear un mostrar/ocultar div???

[bryanzark01]

como puedo crear un boton que me muestre y me oculte un div???

tengo una forma de hacerlo y me funciona, pero me deja el boton encima de lo que me muestra... De esta forma..


[URL=http://www.subirimagenes.com/imagen-est1-8687582.html][IMG]http://s2.subirimagenes.com/imagen/previo/thump_8687582est1.png[/IMG][/URL]

Código HTML:

<a href='http://www.subirimagenes.com/imagen-est1-8687582.html'><img src='http://s2.subirimagenes.com/imagen/previo/thump_8687582est1.png' alt='subir imagenes' border='0'></a> 

y necesito que ese boton quede debajo de los comentarios, cada vez q se muestre...

este es el codigo que utilizo para hacerlo...

Código PHP:

  
 <div class="divspoiler"> 
        <input type="submit"  class="stbut1" value="Mostrar" onclick= "if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; this.value = 'Ocultar'; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none'; this.value = 'Mostrar'; }" /> 
        <font color = "blue"> <?php echo $ax ?> Comentarios </font><img src="ab.jpg"/> 
    </div><div><div class="spoiler" style="display: none;"> 
    <?php 
        echo ""; 
        echo "<div><h2><font color = #f5f5dc> Zona de comentarios </font> </h2></div>"; 
        $select = "SELECT * FROM comentarios ORDER BY id DESC LIMIT 5"; 
        $query = mysql_query($select,$conex); 
        $rows = mysql_num_rows($query); 
        if($rows > 0) 
        { 
            while ($row = mysql_fetch_assoc($query)) 
                {    
                     
                    echo "<fieldset class=fie id=col ><legend><font color= #006654> <strong>" . $row['user'] . "</strong></font></legend>"; 
                    echo "<strong><textarea class=estiloarea disabled=true>" . nl2br($row['comentario']) . "</textarea></strong><br/><br/>"; 
                    echo "</fieldset>"; 
                    echo "<br />"; 
                     
                     
                }  
        }else{ 
             
            echo " "; 
        } 
    ?> 
     
    </div></div>  

[PIRRUMAN]

este tema te puede ayudar
http://www.forosdelweb.com/f13/como-...odigo-1079966/

[bryanzark01]

Iniciado por bryanzark01

como puedo crear un boton que me muestre y me oculte un div???

tengo una forma de hacerlo y me funciona, pero me deja el boton encima de lo que me muestra... De esta forma..


y necesito que ese boton quede debajo de los comentarios, cada vez q se muestre...

este es el codigo que utilizo para hacerlo...

Código PHP:

  
 <div class="divspoiler"> 
        <input type="submit"  class="stbut1" value="Mostrar" onclick= "if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; this.value = 'Ocultar'; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none'; this.value = 'Mostrar'; }" /> 
        <font color = "blue"> <?php echo $ax ?> Comentarios </font><img src="ab.jpg"/> 
    </div><div><div class="spoiler" style="display: none;"> 
    <?php 
        echo ""; 
        echo "<div><h2><font color = #f5f5dc> Zona de comentarios </font> </h2></div>"; 
        $select = "SELECT * FROM comentarios ORDER BY id DESC LIMIT 5"; 
        $query = mysql_query($select,$conex); 
        $rows = mysql_num_rows($query); 
        if($rows > 0) 
        { 
            while ($row = mysql_fetch_assoc($query)) 
                {    
                     
                    echo "<fieldset class=fie id=col ><legend><font color= #006654> <strong>" . $row['user'] . "</strong></font></legend>"; 
                    echo "<strong><textarea class=estiloarea disabled=true>" . nl2br($row['comentario']) . "</textarea></strong><br/><br/>"; 
                    echo "</fieldset>"; 
                    echo "<br />"; 
                     
                     
                }  
        }else{ 
             
            echo " "; 
        } 
    ?> 
     
    </div></div>  

esta es la imagen q no se veia http://s2.subirimagenes.com/imagen/previo/thump_8687582est1.png

[PIRRUMAN]

este tema te puede ayudar
http://www.forosdelweb.com/f13/como-...odigo-1079966/

[hyezs]

<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
$().ready(iniciar);
function iniciar() {
$("#mostrar").click(mostrar);
$("#ocultar").click(ocultar);
}
function mostrar(){
$(".spoiler").show();
}
function ocultar(){
$(".spoiler").hide();
}
</script>
</head>

<div class="spoiler" style="display: none;"> div oculto</div>
<input id="mostrar" type="button" value="mostrar"/>
<input id="ocultar" type="button" value="ocultar"/>

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_sort2 copia y pega ese codigo aca, dale submit code y testea :)