Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje10-12-2013, 04:32 (UTC)    
Título del mensaje: [Resuelto] ayudaaa
Responder citando
necesito un codigo q cuando haces click en un palabra se despliege xd aca les dejo el dibujo





ojala me puedan ayudar,yo tenia este codigo pero se me perdio
______________


Ultima edición por m3sg el Dom Dic 22, 2013 5:07 am; editado 2 veces
↑
Mensaje10-12-2013, 05:01 (UTC)    
Título del mensaje: Re: ayudaaa
Responder citando
Hay 1000 formas de lograr algo con códigos, así es como yo lo haría:

Esto puede ir en texto sobre el diseño, texto por debajo de la pagina, pero preferiblemente en el extra <head>
Código:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script stype="text/javascript">
$(document).ready(function(){
   $(".palabra").click(function(){
      $(".oculto").slideToggle(2000);
   });
});
</script>


Esto va en donde quieras mostrar la frase y lo que quieras desplegar:
Código:
<span class="palabra">Click para abrir o cerrar</span>
<div class="oculto">TODO LO QUE QUIERAS OCULTAR</div>



El diseño es cosa tuya
______________
/* Programador web freelance. */
/* twitter: @jfdelarosa */
↑
Mensaje10-12-2013, 05:40 (UTC)    
Título del mensaje:
Responder citando
Gracias!!,ahora necesitaria un codigo para que el diseño se adapte a la resolucion del usuario este es parte de mi body ya que leei que poniendo 100% andaba pero no me esta funcionando bien,necesitaria algun codigo javascript o algo de eos no se gracias

body{width:100%; margin:auto; min-width:500px;
______________
↑
Mensaje10-12-2013, 11:41 (UTC)    
Título del mensaje:
Responder citando
Hola!,

Mira este tema:
http://www.paginawebgratis.es/forum/viewtopic.php?t=42174

Saludos!
Moderador Design-PWG.
______________

10 años ayudando a PWG.

Soporte PWG: ayuda@paginawebgratis.es
Reportes: support-es@webme.com
↑
Mensaje10-12-2013, 16:15 (UTC)    
Título del mensaje:
Responder citando
design-pwg escribió:
Hola!,

Mira este tema:
http://www.paginawebgratis.es/forum/viewtopic.php?t=42174

Saludos!
Moderador Design-PWG.


Si ya lo vi pero con el diseño q tengo me convendria un codigo q lo haga solo :/
______________
↑
Mensaje10-12-2013, 18:11 (UTC)    
Título del mensaje: Re: ayudaaa
Responder citando
buzzdungeon escribió:
Hay 1000 formas de lograr algo con códigos, así es como yo lo haría:

Esto puede ir en texto sobre el diseño, texto por debajo de la pagina, pero preferiblemente en el extra <head>
Código:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script stype="text/javascript">
$(document).ready(function(){
   $(".palabra").click(function(){
      $(".oculto").slideToggle(2000);
   });
});
</script>


Esto va en donde quieras mostrar la frase y lo que quieras desplegar:
Código:
<span class="palabra">Click para abrir o cerrar</span>
<div class="oculto">TODO LO QUE QUIERAS OCULTAR</div>



El diseño es cosa tuya


Esto sirve solo si vas a poner un oculto en la página, si pones mas de uno, al hacer click se abrirán todos!
↑
Mensaje10-12-2013, 19:28 (UTC)    
Título del mensaje: Re: ayudaaa
Responder citando
bittnet escribió:
buzzdungeon escribió:
Hay 1000 formas de lograr algo con códigos, así es como yo lo haría:

Esto puede ir en texto sobre el diseño, texto por debajo de la pagina, pero preferiblemente en el extra <head>
Código:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script stype="text/javascript">
$(document).ready(function(){
   $(".palabra").click(function(){
      $(".oculto").slideToggle(2000);
   });
});
</script>


Esto va en donde quieras mostrar la frase y lo que quieras desplegar:
Código:
<span class="palabra">Click para abrir o cerrar</span>
<div class="oculto">TODO LO QUE QUIERAS OCULTAR</div>



El diseño es cosa tuya


Esto sirve solo si vas a poner un oculto en la página, si pones mas de uno, al hacer click se abrirán todos!


Si tenes razon recien lo probe,no es como el que necesito yo :/
______________
↑
Mensaje10-12-2013, 22:00 (UTC)    
Título del mensaje:
Responder citando
Código:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
    <script type="text/javascript">
   jQuery(document).ready(function(){
      jQuery(".toggle-trig a").click(function () {
        jQuery(this).parent().next().slideToggle("normal");
        return false;
       });
    });
   </script>

Es es el JS

Código:
<div class="toggle-trig"><a href="#">Toggle user info</a></div>
<div>Hola!</div>

Y este es el HTML
↑
Mensaje10-12-2013, 23:58 (UTC)    
Título del mensaje:
Responder citando
estoy usando este codigo

http://stackoverflow.com/questions/18271449/jquery-javascript-slidetoggle

pero necesitaria que cuando se habra el texto tenga un boton q se cierre,por favor!!!!!!!
______________
↑
Mensaje11-12-2013, 00:37 (UTC)    
Título del mensaje:
Responder citando
Usando el html y javascript de el link:

Código:
<a id='imageDivLink' href="javascript:toggle('skills', 'imageDivLink');">
    <h2>Skills And Expertise</h2>
    <img class='arrow' src='images/arrow_down.png'/>
</a>
<div id='skills' style='display:none;'> Lorem Ipsum... <button type="button" onclick="$(this).parent().slideToggle('fast')">Cerrar</button></div>



Código:
function toggle(divId, switchImgTag) {
    var ele = $("#" + divId);
    var imageEle = $('#' + switchImgTag).find('img');
    if (ele.is(':visible')) {
        imageEle.attr('src', "images/arrow_down.png");
    } else {
        imageEle.attr('src', "images/arrow_up.png");
    }
    $("#" + divId).slideToggle("fast");
}

______________
/* Programador web freelance. */
/* twitter: @jfdelarosa */
↑
Mensaje11-12-2013, 00:45 (UTC)    
Título del mensaje:
Responder citando
buzzdungeon escribió:
Usando el html y javascript de el link:

Código:
<a id='imageDivLink' href="javascript:toggle('skills', 'imageDivLink');">
    <h2>Skills And Expertise</h2>
    <img class='arrow' src='images/arrow_down.png'/>
</a>
<div id='skills' style='display:none;'> Lorem Ipsum... <button type="button" onclick="$(this).parent().slideToggle('fast')">Cerrar</button></div>



Código:
function toggle(divId, switchImgTag) {
    var ele = $("#" + divId);
    var imageEle = $('#' + switchImgTag).find('img');
    if (ele.is(':visible')) {
        imageEle.attr('src', "images/arrow_down.png");
    } else {
        imageEle.attr('src', "images/arrow_up.png");
    }
    $("#" + divId).slideToggle("fast");
}


GRACIAS!!!!!!!!!!!!!!!!,y para que no sea en boton?,que solo sea una palabra??????? que groso!!
______________
↑
Mensaje11-12-2013, 00:57 (UTC)    
Título del mensaje:
Responder citando
Cambia:

Código:
<button type="button" onclick="$(this).parent().slideToggle('fast')">Cerrar</button>


Por:
Código:
<span onclick="$(this).parent().slideToggle('fast')">Cerrar</span>


o por un enlace:
Código:
<a href="#" onclick="$(this).parent().slideToggle('fast'); return false;">Cerrar</a>

______________
/* Programador web freelance. */
/* twitter: @jfdelarosa */
↑
Mensaje11-12-2013, 01:03 (UTC)    
Título del mensaje:
Responder citando
buzzdungeon escribió:
Cambia:

Código:
<button type="button" onclick="$(this).parent().slideToggle('fast')">Cerrar</button>


Por:
Código:
<span onclick="$(this).parent().slideToggle('fast')">Cerrar</span>


o por un enlace:
Código:
<a href="#" onclick="$(this).parent().slideToggle('fast'); return false;">Cerrar</a>


Gracias!!!!!!!!!!! sos un groso jaja,lo otro no sabes no? par aque se adapte la pagina a las resoluciones?
______________
↑
Mensaje13-12-2013, 00:23 (UTC)    
Título del mensaje:
Responder citando
DIOS,NO ESTA RESUELTO,ME FALTA UN CODIGO!!!;EL DE ADAPTAR LA PANTALLA!!!!!!
______________
↑
Mensaje13-12-2013, 01:20 (UTC)    
Título del mensaje:
Responder citando
Ya le saque la etiqueta de resuelto. Por favor no uses todo el texto en mayuscula.
______________

10 años ayudando a PWG.

Soporte PWG: ayuda@paginawebgratis.es
Reportes: support-es@webme.com


Ultima edición por design-pwg el Jue Dic 12, 2013 9:25 pm; editado 1 vez
↑
Mostrar mensajes anteriores:   
  • Página 1 de 2

  •  
    • Saltar a:  


Powered by phpBB © 2001, 2005 phpBB Group

© 2024 webme GmbH, Alemania. Todos los derechos reservados.