JMiur [E]

¿Cómo? ¿No era que no había más efectos en Scriptaculous?

Parte 1
Parte 2
Parte 3
Parte 4

Es que este merece un párrafo especial porque es el más útil de todos ellos y puede usarse rápidamente sin tener que configurar nada.

Effect.toggle permite mostrar y ocultar elementos con animaciones diferentes.

new Effect.toggle('nombre_elemento',modo,opciones);

Donde el modo puede ser appear, slide o blind y definen el tipo de animación a utilizar y las opciones a usar son las mismas de los efectos de la animación correspondiente.

Es recomendable que, al igual que en los efectos individuales, el elemento sobre el cual se va a ejecutar el efecto esté incluido en un contenedor DIV, sobre todo, en IE:
<div id="nombre"><div>contenido</div></div>


En la práctica, esto es lo que nos permite reemplazar otros trucos o script simples como los descriptos aquí o incluso scripts más complejos como los bloques animados en la sidebar.

Todos estos efectos no son otra cosa que herramientas a nuestra disposición, usarlas o no, dependerá de lo que deseemos hacer.

89 comentarios:

Juan Carlos Pua  

Excelente esto tiene mucho de lo que kiero aplicar.

Responder
Gem@  

Sin duda Scriptaculous ofrece más que cualquier otra librería. el problema creo es llegar a conocer todas las prestaciones que tiene. Gracias a tus explicaciones acortas el tiempo de llegar a descubrirlas y no sólo eso sino aprender a manejarlas. ;)

Responder
JMiur  

Las que forman el núcleo, o sea las que ya vienen predefinidas son sencillas de implementar.

Lamentablemente, no hay más pero, hay otras que también son sencillas aunque es necesario agregar pequeños scripts en la plantilla. Ese, será otro paso.

Responder
Juan  

Hola Jmiur

Por fin encontre el ejemplo del
menu con efecto acordeon
aqui esta el link
http://www.artviper.eu/mootoolsmenu/

Atte
Juan Carlos Pua

Responder
JMiur  

Perfecto, Juan pero, ten en cuenta que ese ení usa Mootools y es incompatible con Prototype, colocar ambos scripts puede causar problemas

Para Prototype+Scriptaculous hay una versión AQUÍ.

Hay para todos los gustos :D

Responder
Ester  

Hola Jorge,

Estoy intentando aplicar el Toggle en mi blog de pruebas pero por algún extraño motivo el texto que quiero que aparezca oculto y luego se despliegue, aparece al cargar la página y lo único que consigo es ocultarlo en lugar de hacerlo aparecer.

¿Puede ser alguna incompatibilidad con el código del acordeón que utilizo en la sidebar?

El blog de pruebas está en:
http://picaronadeproves.blogspot.com

Gracias!

Responder
JMiur  

Veo los demos, no veo los enlaces que hacen el efecto. Pero, así en general, para que funcione, el DIV sobre el que vas a efectuar el efecto, deber tener el parámetro STYLE.

Por ejemplo:
<div id="scrdemo622" style="display:none;">
......
</div>
estaría oculto de entrada.

Y:
<div id="scrdemo622" style="display:block;">
......
</div>
estaría visible de entrada.

En ambos casos, luego, con el efecto permutas los estados. No se si se comprende la idea :)

Responder
Ester  

Solucionado!
Lo que faltaba precisamente, era el atributo "style" en el div

Lo que hace que suba y baje es la macetita... me falta solo modificar el icono y ya estará.

Muchas gracias, me va a resultar muy útil!!!

Responder
JMiur  

Me alegro que se solucionara, Ester :)

Responder
Hugo Mosh  

Yo implemente toggle a mi blog y funciona antes de que se cargue la página. No se si sea otro script el que me impide utilizar toggle:

http://hugomosh7.blogspot.com/2008/08/toggle-slide-lorem-ipsum-dolor-sit-amet.html

Ojala me puedas ayudar. Gracias de antemano.

Responder
JMiur  

Algo de eso debe haber ya que he copiado el código de tu ejemplo en mi blog de pruebas y funciona perfectamente:
http://jmiur.blogspot.com/2008/08/test-efectos.html

Ló que se me ocurre es tratar de deshabilitar alguna para ver si puede descubrirse el problema ¿Usas otros efectos con esa librería?

Existe una alternaltiva que es quitar esos scripts del header y colocarlos justo antes de </body> , al final de la página.

Responder
Hugo Mosh  

Es el primer efecto que uso con esa librería.

Cambie los scripts a la parte anterios a /body, pero solo funcionaba con Firefox, ni con iexplorer ni con Safari.

Responder
JMiur  

Entonces, no queda otro remedio que revisar cuál script está interdiriendo. Lamentablemente, eso no hay forma de probarlo online.

Responder
Hugo Mosh  

Ya descubrí cual es el problemas: El código de ShareThis


<script type="text/javascript">var  _sttoolbar = {}</script><script src="http://w.sharethis.com/widget/stblogger.js" type="text/javascript"></script><script type="text/javascript">stBlogger.init('http://w.sharethis.com/widget/?tabs=web%2Cpost%2Cemail&charset=utf-8&services=%2Cmeneame%2Cdigg%2Cdelicious%2Creddit%2Cfacebook%2Cmyspace%2Cgoogle_bmarks%2Cyahoo_bmarks%2Cstumbleupon%2Cwindows_live%2Cmagnolia%2Cfriendfeed&style=default&publisher=30a85e25-96b1-4214-a6a0-fa34e9f87574&headerbg=%234faee3&inactivebg=%23fccffb&linkfg=%23128ded');</script>

¿Hay alguna forma de que pueda solucionar esto (además de quitar el código?
¿O algún otro sistema de bookmark como sharethis que me recomiendes?

Gracias

Responder
JMiur  

Conozco otro similar lamado >Addthis

También hay un elemento de Blogger que hace algo similar, se llama Enlaces de suscripción aunque es más limitado en cuanto a cantidad.

Probaría también cambiar el orden en que se cargan los scripts, invertirlos porque eso podría influir en algo.

Responder
Hugo Mosh  

¿Cómo cambio el orden de los scripts?

O mejor me gustaría usar uno de bookmarks como el que tu tienes. ¿Tienes un tutorial para hacerlo?

Responder
JMiur  

Hugo:

El modelo que yo uso está explicado ACÁ.

Responder
Joan Escoda Codorniu  

Hola, soy nuevo comentando.

Soy incapaz de poner un efecto toggle para los widgets de la sidebar. Cuando le doy se limita a ir al principio de la página.

Me podéis echar una mano, please.

Gracias de antemano

Responder
JMiur  

Joan:
¿Hay algún ejemplo que sea posible ver online aunque no funcione?

Como los elementos son diferentes entre si, habrá que verlos uno por uno. Si viera lo que estás intentando, sería más sencillo darte una respuesta.

Me avisas aquí o por mail y lo miro, no hay problema.

Responder
Joan Escoda Codorniu  

Hola JMiur,

En la seccion "Contacto" de este blog lo intenté: http://kokoloak.blogspot.com

Como verás sí que me funciona en las entradas (la primera) pero no en los widgets.

Muchas gracias de nuevo

Responder
JMiur  

Lo que veo online es un error en el código. Se lee esto:

<a onclick="Effect.toggle("enlaces;,"blind"); return false" href="#">

cuando debría leerse esto:

<a onclick="Effect.toggle('enlaces','blind'); return false" href="#">

No significa que eso es lo que hayas escrito sino lo que interpreta el navegador. Hay u problema con las comillas simples y dobles. El que usas en las entradas tiene el código perfecto.

Responder
Joan Escoda Codorniu  

Hola JMiur,

Lo he conseguidooooooo!!!

Efectivamente era un tema de las comillas. Gracias por tu ayuda!!!

Joan

Responder
JMiur  

Me alegro que encontraras la respuesta :)

Responder
Tigremen  

Buenas tardes JMiur, oye en que parte coloco este codigo new Effect.toggle('nombre_elemento',modo,opciones);

Saludos :D

Responder
JMiur  

Eso, va en el enlace, el texto o la imagen que sirve de enlace. Por ejemplo:

<a href="#" onclick="Effect.toggle('nombreID','blind'); return false">CLICK</a>

Responder
Luciana.-  

Hola Jorge,
Estoy realizando un sitio cuyas subsecciones funcionan con este efecto. Tengo varias subsecciones y c/u tiene su DIV id="". No he tenido inconvenientes en aplicarlo, el inconveniente es que no funciona bien en IE 6.0: las secciones desaparecen -todo el div donde tengo aplicado el código- y de pronto vuelven a aparecer si vuelvo a activar alguna de ellas... es muy extraño. Me funciona bien en los otros exploradores. ¿Te ha pasado o tendrás alguna sugerencia? Dejo el link del boceto de lo que estuve armando: www.tallerbaliero.com.ar/boceto/arquitectura1.html
Ya busqué por todos lados el error... ¡Desde ya muchísimas gracias!

Responder
JMiur  

Luciana:

Mi única solución para ese tipo de cosas es: No usar IE6. Suena drástico pero no lo es tanto. Hace ya un par de años que está la version 7 y en poco tiempo sale la 8. En algún momento, debemos dejar de prestar soporte a ese navegador porque sino, terminaremos locos.

Yo te diría que si no se ve en IE6 pero se ve bien en IE7 y en el resto de los navegadores, te olvides del problema y lo ignores.

Responder
Luciana.-  

¡Gracias por tu respuesta! Ya me estoy volviendo loca...
Estaba viendo de usar alguna otra cosa y adaptarlo.
La verdad es que yo no utilizo IE. El problema es que es para un cliente, y guste o no, probablemente lo vea en esa versión y no funcionará! Si fuera sólo estético no me preocuparía, el problema es que el desajuste lo hace completamente disfuncional en esa versión del browser. De todos modos, te agradezco mucho la intención. Veré qué hago. ¡Gracias, gracias!

Responder
Tigremen  

Gracias JMiur ya me funciono,

Oye JMiur disculpa lo perdido, hace dos dias te pregunte como personalizar los "ultimos comentarios", creo que no me subscribi a los comentarios por que no me llego tu respuesta.
¿Que he hecho hasta ahorita? le pude poner una imagen al lado izq, cambie tipo y tamaño de letra de letra y una linea dotted abajo del nombre del nombre del usuario.
Agregue una clase dentro del script antes del
, lo que no puedo hacer es el efecto hover que tienes en los tuyos.

Me podras dar una pista de como hacerlo?

Gracias anticipadas man.

Responder
Tigremen  

Agregue un script antes del "br/"

Responder
Tigremen  

que bruto soy, disculpa tanto error agregue una clase.

Responder
Tigremen  

Hola JMiur tengo una duda mira aplique este efecto en mi blog http://tigremen.blogspot.com/ pero quize hacerle como tienes en la parte de abajo para "enlaces, directorios y estadisticas".
No de la misma forma como tu lo ocupaste yo lo utilize para tener un menu de entradas (entra para que me entiendas) lo hize abajo del menu horizontal.
El problema es que no se como desaparecer un efecto sin necesidad de darle clic, si no que, cuando le den clic al segundo y asi sucesivamente pienso poner 5 entradas.

Gracias anticipadas!

Responder
JMiur  

¿Es uno con un enlace RIFA, etc? Si es ese, el problema es que si haces un post uy colocas como enlace algo así:
<a href="#nombre" .......
y luego, editas el post en en el modo Redactar, Blogger cambiará el enlace. Fijate que si copias el enlace que muestra el blog, dirá una cosa extrañisima y por lo tanto no funciona.

En un post, cuando usas href="#nombre" sólo puedes editar en modo HTML o sino, tener la precausión de volver a ese mos, cambiar los enlaces y publicarlo.

Responder
Tigremen  

Hola JMiur,
El efecto si funciona solo que cuando cambio al otro, no desaparece el anterior y se encima uno del otro, lo que quiero saber cual seria el codigo que pondria para borrar el efecto que este activo para que no interfiera con el seleccionado.
Lo que hize fue agregar un gadget arriba de los post este es el codigo:

Codigo del gadget agregadp

Ahorita si le das clic a rifa y luego a crear DVD el segundo se encima del otro y no se entiende.

Gracias y Saludos.

Responder
JMiur  

Hay dos DIVS que comparten el mismo espacio. Uno esta debajo del otro y por eso, dependiendo de la combinación de clicks, se ve o no se ve. No hay un código para hacer eso que quieres, habría que escribir alguna rutina que cheque cuñal es visible, etc, digamos que, para que funcionara al estilo de un acordeón y si uno se abre, el otro se cierra.

Responder
Tigremen  

Seria usar alguna condicional? "b:if - else/ - /b:if" la verdad no se por donde buscar.
Te agradeceria mucho me dieras un ejemplo o donde puedo aprender a hacer una rutina asi como dices.
A mi me nacio la idea cuando vi lo que tu haces en el footer con "directorio, enlaces y estadisticas" me imagino que ahi utilizaste esa rutina.

Seria mucho pedirte si me compartieras el codigo que utilizaste en el footer, asi yo lo empleo en lo que yo estoy haciendo.

La anterior solicitud te la hago con respeto, pero me acerco a tu blog por que siempre he encontrado la solucion a todas mis dudas e inquietudes. Espero no estar pidiendo algo imposible, pero es algo que siento que no esta completo en mi blog hasta que no logre ese efecto voy a estar tranquilo jejeje creo que ya tengo los sintomas que comentan en bloggin Tips - are you addicted? .

P.d. si tengo que leer algo orientame y yo lo estudio.

¡Saludos y gracias anticipadas!

Responder
JMiur  

No es tan sencillo de explicar porque todo es muy personal. Una idea genérica.

Dos divs: nombre1 y nombre2

Una función de JavaScript:

function permutar(cual) {
for (var i =1; i<=2; i++) {
auxiliar='nombre'+i;
if (i != cual) {
document.getElementById(auxiliar).style.display='none';
}
}
Effect.toggle('nombre'+cual,'blind');
}

en onclick, se llama a la función con el número de orden del div:

onclick="permutar(1);"

La funcion, primero "oculta" todos menos el 1 y luego ejecuta el toggle.

Responder
Tigremen  

Gracias Master, ya me quedo :D :D :D :D :D :D

Enlace

Solo le voy a ir agregando los divs.

Muchas gracias, admirable tu labor.

Responder
Tigremen  

Hola JMiur, hoy en la mañana me di cuenta que ya no me funciona el efecto toogle, lo raro de esto es que no toque nada de la plantilla, tambien no me funciona el lightwindow, cheque aca en tu blog y me di cuenta que a ti si te funciona el toogle.

Ojala me puedas orientar por donde buscar, yo quiero pensar que es algo temporal de blogger pero bueno no se en realidad.

¡Saludos y gracias anticipadas!

Responder
JMiur  

Tigremen:
El problema está en SkyDrive. Acá anda pasando lo mismo. Han cambaido las URLs de los scripts, siguen alojados pero la dirección es otra. Hay que cambiarlas.

El problema que noté es que ayer cambié algunas y hoy volvieron a cambiar otra vez.

Para Prototype y Scriptaculous, lo que te recomiendo es que no uses esas que alojas en SkyDrive sino las de Google. Fíjate en este post.

Con LightWindow, cambia la URL por la nueva. Hay que esperar y ver de que se trata todo esto.

Responder
Tigremen  

Gracias JMiur si me funciono y ya estoy utilizando los scripts de google para scriptaculous y prototype.

Responder
MicaDeTot  

Buenas de nuevo JMiur

Estancado me encuentro en una solución…, a ver qué ideas me puedes dar…, quisiera poder controlar la ocultación de elementos de la página al acceder a ella, para que después con el efecto Effect.toggle o cualquier otro de expandir y contraer eligieran la posibilidad.

He leído y releído varios post donde hablas de las mil y una forma de mostrar y ocultar elementos y demás, pero no doy con la solución para programar que al acceder oculte los elementos. Supongo que será por código e imagino que también será después tratable para que con un click ocultes varios o muestres varios según lo programado.

Agradecido de antemano

MDT

Responder
JMiur  

Si es con este tipo de efecto, el elemento a desplegar debe estar oculto de entrada colocando style="display:none;". Si se trata de otros, dependerá del caso, debería ver exactamente el problema.

Responder
MicaDeTot  

JMiur

Gracias por la contestación tan rápida.

Disculpa, no me explique bien o no concrete para que te puedas hacer una idea. Pretendo por ejemplo, ocultar el elemento “Archivos del Blog” de la sidebar y en un elemento “Text” en la misma sidebar poner la función Effect.toggle por si es necesario desplegarla.

Al acceder al blog el elemento se muestra y buscaba la forma de poner el (style=”display:none;”) en el código para ocultarla al acceder a la página.

Como sabes (al menos yo no vi la forma) no hay manera en ese elemento de ponerle esa función.

Gracias.

MDT

Responder
JMiur  

Tendría que ver un ejemplo pero, así en general, lo que puedes contraer o expandir es el contenido de un gadget, es decir todo lo que está entre estas dos etiquetas:
<b:includable id='main'>
...........
</b:includable>

Aunque no es el mismo efecto, en este post, usando otro script, hay una demostración de eso.

Responder
MicaDeTot  

JMiur

Ahí está mi dilema…, lo que estoy intentando hacer es ocultar el gadget o gadgets a voluntad con un simple clic o seleccionar en la entrada a la página cuáles se deben mostrar y cuáles no. Quizá no me explique bien, o no entiendas la idea.

En si muchas veces hay sidebar que son interminables, con mucha información y en ocasiones repetitiva que no son de un uso necesario…, por ejemplo, Archivos del blog puede estar escondido mientras tenga un gadget que de los últimos post subidos…, o tener una serie de gadgets que muestran una serie de links y que pueda seleccionarlos en función del post que estés leyendo. Eso me permitirá en el propio post poner un código para esconder o mostrar aquellos elementos que fueran acordes con lo que lee.

Igual hay cosas imposibles, aunque vi que la función en cierta forma si funciona, pues si al “nombre_elemento” le damos el que define al crearlo en el código, lo esconde al hacer clic. Ahora me falta encontrar la forma que al cargar la página o a voluntad por código, pueda esconder esos elementos que no deseo que aparezcan.

En fin, sistema empírico de machaca pruebas…, igual doy con ello, todo y así, te agradeceré cualquier idea al respecto.

MDT

Responder
JMiur  

Para eso, lo que debes usar son los códigos condicionales. En este blog hay elementos de la plantilla que se muestran en el home oeri no en las páginas individuales y visceversa.

Puede hacerse de varias maneras. Un ejemplo sencillo. Supongamos que quiero ocultar él elemento HTML7 en el home. Pondria esto antes de </head> :

<b:if cond='data:blog.pageType == "item"'>
<style>
#HTML7 {display:none;}
</style>
</b:if>

Todas las propiedades de estilo definidas allí, se ejecutarían sólo en las páginas individuales.

Responder
MicaDeTot  

JMiur

Muchas gracias, el lunes empezare a experimentar con ello.

MDT

Responder
Carlos Javier  

Hola JMiur:

Excelente explicación. He podido utilizar el efecto sin ningún problema, salvo...

Pasa que se me dio por ver si podía utilizarlo en el div que contiene las entradas. Todo bien con eso... logré que el efecto funcionara pero... (jejejeje), ocurre que cuando quiero ir a la página de una de las entradas el efecto sigue funcionando (como obvio, ¿no? :P).

Traté de varias maneras para ver si podía condicionar el "display:none", pero los resultados fueron siempre negativos. ¿Existe alguna forma de que esto se pueda conseguir?

Aquí puedes ver el blog, pero en este momento he desabilitado el efecto toggle para la opción "Blog" del menú.

Saludos, JMiur, y gracias por tu tiempo.

Responder
JMiur  

Como el display none debe estar en la etiqueta del div, me parece difícil hacerlo. Podrías intentar condicionarlo pero poner la condición después de ese div, para que la sobrescribiera:

<b:if cond='data:blog.pageType == "item"'>
<style>
#Blog1 {display:block;}
</style>
</bif>

Tal vez antes de la sidebar o después del div main o incluso al final de la página. Eso haría que en las páginas individuales se mostrase desplegado.

Responder
Carlos Javier  

Hola JMiur:

Gracias por la prontísima respuesta.

Te cuento que uhmuhm... nada, de nada, probé tal cual como me dijiste, y cuando menos a mi, no me funcionó. Incluso puse la condicional el footer, pero nada.

Bueno... supongo que al menos por ahora no se puede hacer.

Viejo, de nuevo gracias por tomarte la molestia.

Tengo otra pregunta, pero vi que ya la respondiste en el comentario #37. Voy a ver si puedo aplicarlo, y si no, ya te estaré molestando de vuelta.

Saludos! :)

Responder
JMiur  

Sí, la opción esa sería válida. Si no, simplemente poner un enlace que haga el Toggle pero que ese enlace siempre esté visible.

Responder
ღ๑۩۞۩๑இ £ª Я¤Şα Ążůſ இ๑۩۞۩๑ღ  

¡Hola!
He intentado poner este efecto pero no veo el resultado, ¿sirve para blogspot?, me gustaria que funcionara en sidebar y en las entradas, ¿cómo hago esto? les dejo mi blog, ojalá me puedan ayudar y responder en el blog o con un mail ahí mismo. Gracias
www.laguna-de-los-suenos.blogspot.com

Responder
JMiur  

Sí. Funciona en cualquier sitio. de hecho, este blog está en blogspot y ahi está el dem y aplciado a diferentes partes de la plantilla.
Lo que no veo en tu sitio es que estén incluidas las librerías necesarias.

Responder
Cristian  

Y que codigo hay que colocarle para que el elemento a ocultar esté inicialmente oculto?

Responder
JMiur  

El elemento debe tener el atributo al inicio, por ejemplo:

<div id="miDEMO" style="display:none;">

Responder
Ángeles  

Hola Jorge, soy Ángeles, y tengo una duda, con la página de fotografía de mi amigo y ahora tengo problemas con el formulario de comentarios ¿es posible aplicar el efecto ocultar/ mostrar a los comentarios que aparecen al pie de las entradas. Me gustaría que aparecieran -el formulario y los comentarios- únicamente en la ventana emergente pero no en la página. Un saludo

Responder
JMiur  

Sí, en principio no deberías tener problemas, por defecto, lso comentarios están en un bloque cuyo ID es:

comments-block

Así que debría ser posible colcoar un enlace y permutar el estado de ese rectángulo.

Responder
Sheldon  

Wow muchas gracias por publicar esto! es justo lo que andaba buscando.. lo único que te diría es que deberias mencionar en el cuerpo del post (porque lo mencionas en los comentarios) que hay que jalar los scripts de esa pagina de Google que das, pues sin saber eso tuve varios problemas porque como usamos Blogger, no tenemos un directorio y los sitios para alojar files a veces cambian las urls.
en fin, en este post use este truquillo: http://theall-knowing4.blogspot.com/2010/04/shane-hines-blues-for-balalaika.html

Responder
JMiur  

Si tienes un blog sabrás que las entradas no se actualizan y esta, tiene más de un año de antigüedad.

http://vagabundia.blogspot.com/2008/08/problemas-al-re-alojar-scriptaculous.html
http://vagabundia.blogspot.com/2010/01/las-librerias-de-google.html

Responder
Sheldon  

En realidad si tengo varios blogs y en el que publico actualmente (theall-knowing4.blogspot.com/), si trato de mantener actualizados algunos posts que se que lo necesitan.
Bueno, pasando al tema que me traia de vuelta a este post, creo que al agregar scriptaculous a mi blog (alojandolo en AJAX Libraries API de Google), me a producido problemas con el Friend Connect de Google. Ahora simplemente ya no aparece ese cuadro.. supongo que tiene algo que ver esto de scriptaculous.. ojala me puedas ayudar
saludos, sheldon

Responder
JMiur  

Yo tengo por costumbre no juzgar lo que hacen los otros porque no creo que sólo haya un modo de hacer algo. Para el problema de Scriptaculous, fíjate en esta entrada:
Problemas con Seguidores usando Prototype

Responder
Sheldon  

Muchas gracias, me arreglo el problema =)

Responder
LuzdeLuna  

Hola JMiur! quiero hacerte una preguntita: tengo este efecto toggle para ocultar parte de algún post largo, funciona perfecto; pero para cerrar hay que volver al enlace que lo abrió, para solucionar esto y hacerlo desde el final del post puse:
Cerrar
pero me lleva a la cabecera y no al comienzo del post. como debería hacerlo?
(donde van xxx se lee onclick)
Gracias, un abrazo

Responder
LuzdeLuna  

uchaaaaa :( no se ve el codigo!!, bue es igual al del comentario nº25. Cierra, pero por poco me saca del monitor :P cómo podría hacerlo, JMiur, para que solo me lleve al título o al "abrir"???

Responder
JMiur  

Cualquier cosa, me lo mandas por mail pero, con Toggle, el código para desplegar es exactamente el mismo que para contraer. No sé si lo tienes en un enlace, si fuera así, por ejemplo:

<a href="javascript:Effect.toggle('NOMBRE','slide');">CLICK</a>

Responder
Lionel  

Hola Jmiur, no entiendo como combinar el efecto toggle con el appear. Me podrias dar el código?

Responder
JMiur  

Todos son iguales, cambia el nombre del efecto:

Effect.toggle('MIDIV','appear'); return false;

Responder
Lionel  

No me equivoque, no se como poner para que el efecto aparezca inicialmente oculto.. Disculpas..

Responder
JMiur  

También es simple, bastaría ocultarlo con display: none;

<div id="nombre" style="display: none;">
<div> ... contenido ... </div>
</div>

Responder
Lionel  

Muchas Gracias JMiur!!

Responder
León  

No me cierra de ninguna forma Jmiur :S

Estuve casi tres horas y no puedo hacerlo funcionar.
Me confunde que no haya un código completo de ejemplo para saber donde está mi error. Por que si bien en los posts anteriores de scriptaculous y en este explicas la forma de armar los códigos y esas cosas, no lo encontré del todo claro.

Estuve armando un par de divs en mi blog de pruebas.

Ojalá puedas echarle un ojo y guiarme un poco. Opté por borrar el script y el código por las dudas.

Los div en cuestion son xplorer y 2xplorer, lo que quiero es que 2xplorer (el rectangulo colorado) aparezca y desaparezca haciendo click en el bloque que dice IMPORTANTE (xplorer).

Muchas gracias desde ya, como siempre :)


http://ojalaqueandes.blogspot.com

Responder
JMiur  

Si vas a usar un DIV para lanzar el efecto, ese DIV debe ser distinto del otro que es el que vas a abrir y cerrar. Por ejemplo, algo así:

<div id="xplorer" onclick="Effect.toggle('2xplorer','blind'); return false">
IMPORTANTE
</div>

<div id="2xplorer" style=".........">
..................
</div>

Responder
León  

Sigue sin funcionar :S

Responder
JMiur  

Tu código fuente dice:

<div id='xplorer' onclick='Effect.toggle(\'2xplorer\',\'blind\'); return false'

y yo te dije que colocaras esto:

<div id="xplorer" onclick="Effect.toggle('2xplorer','blind'); return false"

las comillas dobles externas contienen el onclick y las comillas simples los valores; no hace falta la barra invertida.

Responder
León  

yo no las puse :S copié el código tal cual me dijiste, pero cuando guardo la plantilla y vuelvo a entrar noto que se cambian las " por ' y las ' por &apos; y me lo deja así

<div id='xplorer' onclick='Effect.toggle(&apos;2xplorer&apos;,&apos;blind&apos;); return false'

Como evito que me lo transforme automáticamente??? :/

Responder
León  

Ya lo solucioné Jmiur, solo debía cambiarle esos &apos; que me aparecían por " ya me funciona de maravillas, muchas gracias :D

Responder
Graciela  

Jorge, me pregunto ¿se puede poner el efecto de contraer y expandir? tengo colocado 'leer más en etiquetas'

Gracias chamigo!!!

Responder
JMiur  

Poder se puede pero por l oque veo en tu blog, allí, en las páginas de etiquetas, lo que usas es un script que meustra un resumen y no la entrada completa oculta así que habría que cambiar eso y usar otra forma de mostrarlas, modificar el script, etc.

Responder
Graciela  

Bien, existe alguna manera de colocar leer más, sin poner cada vez que hace un post el código?

Responder
JMiur  

El Leer Más de Blogger no; para eso, debería usarse un script que mostrara alguna clase de resumen.

Responder
Graciela  

Eso vos me lo aconsejás, o directamente aplico el leer más?

Responder
JMiur  

El LEER MAS de Blogegr afecta tanto a esas páginas como al home; no sé si es eso lo que querés.

Responder
Graciela  

Mi plan ;) saco lo de leer más en las etiquetas.
Implementar, seguir leyendo sin que afecte la primer entrada, luego el efecto de abrir y recoger...¿se puede esa cosa?

Responder
JMiur  

Si, se puede hacer pero no saldrá solo en las etiquetas sino también en archivos y cuando uses la navegación de Entardas antiguas/Entradas recientes.

Si lo que querés es que sólo se vea el título y un enlace para abrir las entradas completas en otra página, no hace falta un script (es el modo en que se mostraba el blog de Gem@ antes) Si lo que querés es que se muestre un resumen ahi necesitas un script.

¿Por que no me explcias bien por mail y me decís si viste algo por ahí que sea similar a lo que querrías tener?

Responder
EACTfull  

JMiur Como podría aplicar el efecto en el archivo del blog lo intente
pero no me se el id de las entradas en el archivo ya probé con ///id="posts"///

gracias de antemano ;)

Responder
JMiur  

¿En qué blog quieres aplicarolo y a que parte de él te refieres? ¿Al contenido de las entradas?

Responder
EACTfull  

No es a las entradas, es para el archivo del Blog quiero este efecto para que cuando expandan y/o contraigan las flechas del archivo aparezcan las entradas con el efecto appear

Responder
JMiur  

Puedes hacerlo con el gadget en si mismo pero con su contenido, lo dudo ya que eso es algo que controla Blogger.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR