problema con script

juan_14nob · #1 (**permalink**) 14/03/2011, 18:16

problema con script o mi cabeza jajaja..
Bueno lo que quiero hacer es lograr deslizar la capa "divtapa" y mostrar el formulario que contiene. los efectos los hago con la libreria Spry.. Cuando presiono el enlace "Nuevo" la capa oculta se desliza hacia abajo y muestra dicho contenido, para cerrarlo es con el enlace "Ocultar" entonces este divtapa se desliza hacia arriba tapando el contenido.. pero la misma funcion la hace el enlace "Nuevo" y lo que yo quiero es que al ser pulsado por primera vez el enlace "Nuevo" la capa de deslise pero que cuando lo vuelva a presionar no lo deslize de vuelta hacia su lugar

Saludos y gracias aquel que me logre ayudar!!!

codigo..

Código HTML:

<html>
<head>
<title>Usuarios</title>
<script>
function enviar_formulario(){
   document.formulario1.submit()
}
</script> 
<script src="SpryAssets/SpryEffects.js" type="text/javascript"></script>
<script type="text/javascript">
<!--

function MM_effectBlind(targetElement, duration, from, to, toggle)
{
	
	Spry.Effect.DoBlind(targetElement, {duration: duration, from: from, to: to, toggle: toggle});
	
}
function efec(targetElement, duration, from, to, toggle)
{
	
	Spry.Effect.DoBlind(targetElement, {duration: duration, from: from, to: to, toggle: toggle});
	
}


//-->
</script>
<style type="text/css">

body {
    font-family: Arial,Helvetica,sans-serif;
	font-size:11px:
	}
a{
    color: #0B55C4;
    text-decoration: none;
	font-size:11px;
	font-weight:bold;
}
#divtapa{
	position:absolute;
	width:190px;
	height:100px;
	z-index:999;
	background-color:#FFFFFF;


}
</style>
<script type="text/javascript">
function desactivar(enlace)
{
enlace.disabled='disabled';
}

</script>
</head>
<body>
<div id="botones">

<label>
<a href="javascript:MM_effectBlind('divtapa', 500, '100%', '0%', true)" name="button" type="button" id="formu2" onclick="desactivar(this)"/>Nuevo</a>

  </label>
<a href="javascript:enviar_formulario()">Eliminar</a><br>

</div>

  


<form action ="usuarios.php" method="POST" id="form11" name="form11">
<div id="divtapa" > </div>
	<div id="div1">

Usuario: <input type="text" name="usuarios"><br>
Contraseña:<input type="text" name="contrasena"><br>
permiso:<input type="text" name="permiso"><br>
<input type="submit" value="aceptar" name="boton">

</div>
</form>	
<label>
<a href="#" name="button" type="button" id="formu2" onclick="efec('divtapa', 500, '100%', '0%', true)" />Ocultar</a>

  </label>
</form>







no exuste




</body>
</html>

Naahuel · #2 (**permalink**) 14/03/2011, 18:25

Y pues no uses Toggle. Toggle significa conmutar. Lo que quiere decir que si estaba mostrando, se oculta y viceversa.

La línea que dice:

Código Javascript:

Ver originaljavascript:MM_effectBlind('divtapa', 500, '100%', '0%', true)

Debería ser:

Código Javascript:

Ver originaljavascript:MM_effectBlind('divtapa', 500, '0%', '100%', false)

Usando false en toggle y además de 0% a 100% (pues lo estás mostrando). Si lo querés ocultar harías de 100% a 0%.

Espero te sirva. Un saludo.

-edit-
Lo mismo va para el botón de ocultar. No uses toggle.

juan_14nob · #3 (**permalink**) 14/03/2011, 19:40

Cita:

Iniciado por Naahuel

Y pues no uses Toggle. Toggle significa conmutar. Lo que quiere decir que si estaba mostrando, se oculta y viceversa.

La línea que dice:

Código Javascript:

Ver originaljavascript:MM_effectBlind('divtapa', 500, '100%', '0%', true)

Debería ser:

Código Javascript:

Ver originaljavascript:MM_effectBlind('divtapa', 500, '0%', '100%', false)

Usando false en toggle y además de 0% a 100% (pues lo estás mostrando). Si lo querés ocultar harías de 100% a 0%.

Espero te sirva. Un saludo.

-edit-
Lo mismo va para el botón de ocultar. No uses toggle.

Sin el toggle no funciona ninguno.. osea no hace nada..
igualmente si lo hago asi cuando presiono 2 veces en "Nuevo" vuelve a deslizarce y eso es lo que no quiero que haga quiero que baje, bloquee el boton1. se habilite el otro, y al ser presionado se deshabilite y se deslize hacia arriba...

Naahuel · #4 (**permalink**) 14/03/2011, 19:57

Yo lo he probado y funciona. Es cierto que hace eso que decís, que presionando de nuevo en "Nuevo" vuelve a deslizarse.
Para ser honesto no conozco esa librería, prefiero jQuery. Voy a hacer lo que vos querés en jQuery y a lo mejor te sirve o podés traducirla. Sino, habrá que esperar que alguien que conozca mejor esa librería te ayude.

Código HTML:

Ver original<html>
<head>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js'></script> 
<style>
    #mostrame{
        position:fixed;
        left:40%;
        top:0;
        width:200px;
        height:200px;
        background: yellow;
        display:none;
    }
</style>
<script>
    $(document).ready(function(){
        //al hacer click en mostrar:
        $('#mostrar').click(function(evento){
            evento.preventDefault()
            $('#mostrame:hidden').slideDown();
        });
        //al hacer click en ocultar:
        $('#ocultar').click(function(evento){
            evento.preventDefault()
            $('#mostrame:visible').slideUp();
        });
    
    });
</script>
</head>
<body>
<div id="contenedor">
    <div id="mostrame">
        <p>Me ven y no me ven</p>
    </div>
    <a href="#" id="mostrar">Mostrar </a> | <a href="#" id="ocultar">Ocultar</a>
</div>
</body>
</html>

Ese pequeño ejemplo hace lo que necesitás. A mi forma de ver, jQuery es mucho más sencillo. El problema que tenías lo he solucionado en dos líneas. Acá lo podés ver funcionar:
http://jsbin.com/afuce4

Observá que no importa cuantas veces clickees mostrar, sólo se muestra una sola vez. Esto es gracias al selector de jQuery que filtra con ':visible' o ':hidden'.

Realmente espero que te sirva, lamento no poder ayudarte con SpryEffects. Un saludo.

juan_14nob · #5 (**permalink**) 14/03/2011, 21:02

muy interesante, muchas gracias !! :)