Esta es una forma de hacer su página más interactiva, de modo que el lector pueda "jugar" con ciertos elementos de la página pudiéndolos arrastrar de un lado a otro dentro del contenedor en el que están.
Este es un ejemplo:
Para hacer que las imágenes se puedan mover y arrastrar entra en Diseño > Edición de HTML y antes de </head> pega lo siguiente:
<!-- Prototype y Scriptaculous-->
<script src='http://www.google.com/jsapi'></script>
<script>
google.load("prototype","1.7.0.0");
google.load("scriptaculous", "1.9.0");
</script>
<!-- Prototype y Scriptaculous-->
Nota: Es posible que el código anterior ya lo tengas en la plantilla, si es así no es necesario volverlo a pegar, así que omite ese paso.
Ahora cuando quieras hacer que la imagen de una entrada se pueda arrastrar usa el siguiente código dentro del post:
<img id="drag1" style="cursor:move; border:0px;" src="URL de la imagen"/>
<script type="text/javascript">new Draggable('drag1');</script>
Agrega la URL de la imagen donde se indica y listo. Ten en cuenta que cada vez que vayas a hacerlo deberás cambiar la ID de la imagen (lo que está en color verde), por ejemplo drag2, drag3, etc. de modo que ninguna imagen tenga el mismo ID.
Es así de simple que con Scriptaculous podemos darle más dinamismo al sitio web y más diversión para los más pequeños.
Ver | Segunda parte
Ciudad Blogger
Ers el mejor tienes una solucion para todo, que bueno soy el primero en comentar.
ResponderEliminarEsta super bueno el truco si hasta me quede jugando con la imagen un rato... xD
ResponderEliminarsaludos
Holaa!!
ResponderEliminarQue bueno el truco! muchhas gracias
ahora tengo unas preguntitas:
¿Se podria poner un enlace si pincharas dos veces?
¿Se podria hacer con texto? Si la respuesta es si, se podria poner un enlace en el texto?
Siento darte tanta faena ;)
Gracias de todos modos:)
Saludos!
Me encanto, estuvo perfecto este truco, creo k es uno de mis trucos favoritos...Muchas gracias por compartilro.
ResponderEliminarSaludos!
Entretenido e interesante, gracias.
ResponderEliminarUn saludo
Anti-Haker, gracias por tus comentarios, saludos!
ResponderEliminarfabian, la verdad es que sí está muy entretenido =)
Dj Nestor, sí, sí se puede hacer todo eso, en el siguiente post lo explicaré, saludos!
PepeX, gracias a ti por tu visita, saludos.
Gildo Kaldorana ¿verdad que sí? me alegro que te haya gustado, saludos.
Wow Wow Wow !!! esto si que no lo conocía!! magnífico bro!!!! me hiciste acordar al scipt para Firefox que permite modificar las Webs!!!
ResponderEliminarHe movido el logo de Blogger y lo deje entre los anuncios, para que el próximo que lo quiera arrastrar se equivoque y de un clic! JAJAJAJAJAJAJAJAJAJAJAJAJAJAJAJA!!! XD
Un abrazo!!!
Como siempre "Excelente".
ResponderEliminarVoy a pensar en que puedo sacar provecho.
Saludos Potro.
Jpz.-
OK Muchas gracias, y podrias poner tambien en el post (si se puede ) Que cuando se mene una imagen peranezca aunque se recargue o se salga de la pagina, y al volver tenerla donde estaba.
ResponderEliminarY el colmo de esto seria= Un boton de reset jaja!!
Saludoos!
brother, jajajaja, para nuestra mala suerte la imagen no se queda ahí para el próximo usuario, sino sería genial. Un abrazo!
ResponderEliminarJpz, en algo quedará bien, a ver si con el próximo post te inspiras más. Saludos!
Dj Nestor, no creo que sea posible que la imagen quede en el lugar donde la moviste por última vez, al menos yo no lo sé hacer. Saludos.
Muchas gracias de todas formas!!:)
ResponderEliminarJajajajajajajaja...so lo se, aunque tengo que reconocer que lo primero que se me vino a la mente luego de recargar la página era como diablos hacer un scipt "con memoria" para que quede donde lo dejaba!! jaajjajajajajajajajajajajajaja!!!!
ResponderEliminarNo me quites las ilusiones así bro.. al menos dejame soñar que somos millonarios gracias a AdSense! XD
Un abrazo!
brother, cuando seas ingeniero serás millonario, qué te preocupa, jaja, un abrazo!
ResponderEliminarJoel, es donde lo pongas, cada vez que lo pongas tienes que asignarle una nueva ID, la que tú quieras. Ya sea en una entrada, en la sidebar, etc. Saludos.
Uhhhh.... ojolá así sea!! Lo primero que haré será comprar Google AdSense y cambiaré sus políticas para que diga "Los clics realizados en CiudadBlogger serán pagados como mínimo 100 dólares cada uno" XD
ResponderEliminarUn abrazo!!!
Esto está muy bien. ¿Hay algo similar para JQuery?
ResponderEliminarGracias potro
ResponderEliminarmuy bien hecho, lo estuve buscando para una web pero
pues me canse y ahora veo que tu lo publicas gracias
y pues espero colocarlo en breve GRACIAS
brother, con que paguen ya es más que suficiente XD
ResponderEliminarJosé GDF, sí, usando EasyDrag de JQuery puedes tener los mismos resultados.
Alex, me alegro que lo hayas encontrado!
No puedo ver el ejemplo, alguna recomendación, voy a tratar de recargar la página...
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarhE ENCONTRADO TU BLOG DE CASUALIDAD HACE POCO Y YA ES DE MIS PREFERIDOS.
ResponderEliminartengo una pregunta, haber si tu saber como hacer.
mi blog es : http://www.pontenova.es/
Sale una flecha naranja al lado de cada entrada que quiero eliminar. ha buscado mucho, le he pedido ayuda al escaparate de rosa, a tuneando el blog y nada. d
se cambian mas arriba, pero no la flecha. la quiero eliminar.
muchas gracias.
mi correo es pontenova.es@gmail.com
Hay alguna forma de hacerlo con JQuery? Porque yo quiero mi gadget de seguidores...
ResponderEliminarEsta genial
ResponderEliminarLa voy a usar mañana.
Hola PONTENOVA.ES,
ResponderEliminarEntra en Diseño > Edición de HTML y busca esta parte:
.post h3 {
margin:0;
line-height:1.5em;
background:url("http://www.blogblog.com/rounders2/icon_arrow.gif") no-repeat 10px .5em;
display:block;
border:1px dotted #cccccc;
border-width:0 1px 1px;
padding:2px 14px 2px 29px;
color: #cc0000;
font: normal bold 195% 'Trebuchet MS',Verdana,Arial,Sans-serif;
}
Elimina lo que está en negrita y listo.
Saludos!
Ascesino96, sí, sí la hay, más adelante hago una entrada para explicarlo, saludos.
ResponderEliminarEl Venado, ojalá te quede muy bien, saludos!
Realmente buenísimo potro, sin duda este es el mejor blog de ayuda para los usuarios de blogger que conozco, sin quitarles mención a los demás, tus aplicaciones, y herramientas son interesantes... me dan muchas ganas de hacer copy paste, jajaja saludos Man...
ResponderEliminarHola JULIO CESAR,
ResponderEliminarMuchas gracias por tu comentario, me da gusto saber que el trabajo de este blog puede serte de ayuda para ti y para otros usuarios.
Saludos!
Genial esta divertido ese codigo
ResponderEliminargracias potro
Gracias a ti por tu visita.
ResponderEliminarSaludos!
Este comentario ha sido eliminado por el autor.
ResponderEliminarupss la borre oie potro tenia una dida como puedo centar un widget esque este se ve como que chueco
ResponderEliminarhttp://unrealmat-pruebaz123.blogspot.com/
Me gustaria que quedara centradito
esa plantilla la pienso usar `para año nuevo :s Shhh!
jeje
aver si me echas una mano aver si te conectas alarato boeno ahora estoy en line Porfavos Potro te lo agadeceria mucho
Hola ,
ResponderEliminarAl código que tienes agrégale lo que está en negrita:
<center><a href="http://www.unrealmat.com/2009/12/repeticion-wwe-tlc-2009-table-leadder.html"><img alt="twitter" src="http://i638.photobucket.com/albums/uu101/unrealmat/TLCpnglogo.png?t=1259432224"/><br/><b>Clic imagen = Repetición</b></a></center>
Saludos.
GRACIAS POTRO
ResponderEliminarPERO NO ERA ESE :(
MAS VIEN SERIA EL DE ACA
http://unrealmat-pruebaz123.blogspot.com/
SOLO QUERIA QUESE CENTRATA MIS SEÑALES Y MI XAT SINO LUEGO PLATICAMOS POR EL MSN PORQUE LA VERDAD ESTOY MEDIO WEY PARA EXPLICAR
Es el mismo procedimiento, hay que encerrar los códigos entre <center> y </center>
ResponderEliminarSaludos.
mil millones de gracias. eres el puto amo. gracias a gente como tu podemos hacer genialidades.
ResponderEliminarEnseguida te enlazo en mi blog
gracias de nuevo.
Por nada, me alegro haberte podido ayudar.
ResponderEliminarSaludos y gracias por el enlace!
Wah!!! Genialísimo este truco.
ResponderEliminar¿Es posible poner bordes (marco) a la imágenes arratrables?
Mil gracias
Claro ABRIL, en el segundo código verás esta parte:
ResponderEliminarstyle="cursor:move; border:0px;"
Cámbialo por esto:
style="cursor:move; border:2px solid #000000;"
Ahí he puesto un borde de 2px y un color negro pero tú puedes elegir el tamaño del borde, el color y el estilo.
Saludos.
Perfecto.
ResponderEliminarMil gracias
Hola, ¿ es posible poner la imagen fuera de las entradas y sign siendo arrastrables ?
ResponderEliminartengo otra pregunta ojala que puedas ayudarme, tengo la frase de los comentarios que dice por ejemplo 1 comentario debajo de cada entradas de mi blog, pero quisiera mover esa palabra (1 comentario) fuera de una entrada se puede ?
ya he visto a otro blogger que lo ha hecho.
Hola Forrito,
ResponderEliminarPuedes poner la imagen dentro de la sidebar, o bien, directamente en tu plantilla antes de </body>
¿A dónde quieres mover el link de los comentarios?
Saludos.
En la imagen muestro mi idea del link de los comentarios
ResponderEliminary los cuadrados en rojo marcados son la ubicacion de donde quisiera que vayan las imagenes arrastrables como lo explica tu entrada.
img97.imageshack.us/img97/2401/dandyman20080829ss.jpg
por ejemplo este codigo ya lo puse antes del body con esta imagen que quiero pero no me gusta el lugar donde se por defecto, quisiera subirlo mas arriba quiero cambiar la posision ayudame :) ?
ResponderEliminarparece que no aparecio el codigo en mi comentario pero esta es la imagen que agrege al codigo que nos das arriba
ResponderEliminarhttp://img64.imageshack.us/img64/3584/technorati64x64.png
ya esta fura de las entradas pero ahora como lo subo mas arriba y centro a la derecha o izquierda.
gracias
Podrías intentar cambiarlo de lugar poniendo esto:
ResponderEliminar.comment-link {
position:absolute;
left:-58px;
}
Aunque no le encuentro la razón para hacer arrastrable el link de los comentarios.
La otra imagen que mencionas sigue esta explicación, sólo le agregas lo necesario para que se pueda mover la imagen:
http://ciudadblogger.com/2009/03/poner-imagen-estatica-en-el-blog.html
Saludos.
disculpa, no logro entender aun soy novato en esto, uso la plantilla note pad chaos he buscado .comment-link { y no lo encuentro, talvez puedas ver el codigo de una plantilla notepad chaos y me ayudas un poco a ubicarme mejor porfavooooooooor.
ResponderEliminarSi no lo tiene entonces agrégalo tal como lo he puesto.
ResponderEliminarSaludos.
abajo de que codigo lo pego.
ResponderEliminarque codigo busco para pegarlo luego ?
creo que me deje entender mal, no me refería que el link de comentarios sea arrastrable sino moverlo de su lugar a otra parte.
ResponderEliminarEn el fondo de mi blog tengo una imagen de un foco y quiero centrar el link de comentarios en el foco pero no puedo porque el link de comentarios va abajo.
porfavor dame una mano con esto >.<
Hola Forrito,
ResponderEliminarEntra en Diseño > Edición de HTML, marca la casilla Expandir plantillas de artilugios y busca este código:
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/> Comments</a>
Selecciónalo y sustitúyelo por esto:
<a class='comment-link2' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/> Comentarios</a>
Luego pega antes de ]]></b:skin> lo siguiente:
.comment-link2 {
position:absolute;
top:340px;
left:130px;
}
Eso es todo, en el último código puedes centrarlo a donde quieras.
Saludos.
Genial, y yo que pense que no tenias intencion de ayudarme te agradesco muchisimo y eso multiplicalo por mil gracias
ResponderEliminarMe funciono todo bien, como podria cambiarle de color y aumentale el tamaño ?
Al último código agrégale esto:
ResponderEliminarcolor:#FF0000;
font-size:24px;
El primero es el color, lo puedes cambiar por el código del color que quieras. El segundo es el tamaño de la letra, también lo puedes cambiar.
Saludos.
Muchas gracias por tu ayuda todo salio de ......
ResponderEliminargracias.
Como uso este efecto de arrastrar pero fuera de las entradas quiero esparser algunas imagenes arrastrables pero no quiero agregarlas en una entrada o widget quisiera ubicarlas como imagenes flotantes.
proto me podrias dar un ejemplo de este codigo arrastrable combinado con el codigo de imagenes flotantes para entender :) ?
y en que lugar de mi plantilla note pad chaos lo pondria el codigo?
derrepente no me entiendas yo me referia como por ejemplo en tu blog la flechas pequeñas de arriba o abajo A ESAS aparte que flotan agregarle el efecto rollover para que cuando pases el mause se haga mas grande
ResponderEliminarefecto rollove + imagen flotante + LINK (vinculo )
en mi caso quiero una imagen fija en una zona que no sea entrada ni widget + el efecto rollever espero tu consejo no se como combinarlos.
muchas gracias.
Joel, muy creativa tu tarjeta de Navidad ;)
ResponderEliminarForrito, si cambias de parecer a cada rato me va a costar más trabajo entenderte, en el comentario anterior decías que querías que algunas imágenes fueran arrastrables.
Usa este código antes de </body>:
<a href="URL del enlace"><img src="URL de la imagen" style='position:fixed; bottom:0; left:0;' onmouseover="this.width=300;this.height=100;" onmouseout="this.width=80;this.height=50;" width="80" height="50" /></a>
Para saber cómo cambiar las dimensiones de la imagen visita el siguiente post:
http://ciudadblogger.com/2009/09/agrandar-imagen-al-pasar-el-mouse-ii.html
Vaya no me dejo entender bien, disculpa tratare mostrándote la diferencia de los blogs para que pueda ser entendible mi idea.
ResponderEliminareste blog es mio
http://forripruebas.blogspot.com/
este blog es de Oloman el ganador del concurso diseño blog 2009.
http://oloblogger.blogspot.com/
No estoy tratando de copiarlo solo lo hago casi igual
para que puedas entenderme mejor.
El tiene en la parte derecha superior dos botones uno es de su FEED y otro para seguirlo en TWITTER, al parecer para mi yo creo creo que esta usando los efectos de rollover para que cuando pase el mause brillen los botones y a eso le agrego una imagen desubicada fija.
estas dos URLs son los tutoriales donde explica cada efecto pero por separado
http://oloblogger.blogspot.com/2009/03/position-imagenes-fijas-o-desubicadas-i.html?showComment=1257797992862#c1405064860770497901
http://oloblogger.blogspot.com/2008/09/botones-en-movimiento-rollover.html?showComment=1260940247858_AIe9_BFAdwIeCwOTbj5fSNo7yqNIsclusGn7LqE0Vc7SRVe9TsFQAp9CCwK6yRvHbe3rSQhKVq-fOtdB0UpbeaZv3n7Wtmvo6kaO-XE47vViRpBRofVBWzRiX1N33JiSLVITh6RR7p_G0EGEwsyR5QXoGoljxqtArzcEW4b27eDS2BfsmUwX9RH-hXA3SYwk8mMqFMgqeEfKAxRaEOZ2bf8_fWkZ-HPVWCJQ9iaBkloSZgCpMePl9aM#c2689188463399007520
En resumen ---------------------------------------
quiero tener los mismos efectos que uso el para que se suscriban a su TWITTER solo que con otra imagen y en otra parte y que pueda ser arrastable .
Hola Forrito,
ResponderEliminarNuevamente antes de </body> pega lo siguiente:
<a href="URL del enlace"><img style='position:fixed; bottom:0; left:0;' src="URL de la imagen UNO" onmouseover="this.src='URL de la imagen DOS';" onmouseout="this.src='URL de la imagen UNO';"/></a>
Cambia las URL de las imágenes y del enlace donde se indica.
Para conocer más del tema visita este post.
Saludos.
Este comentario ha sido eliminado por el autor.
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarhe tenido preguntas disculpa que las haya eliminado, ya las he resuelto.
ResponderEliminaraun tengo dos dudas
Como hago una imagen arrastrable que este ubicada fuera de un widget o una entrada ?
porque quisiera ubicarla en esta zona del navegador y sea arrastrable
width:100px;
height:100px;
- si la respuesta es que pegue el codigo en el HTML
entonces en que lugar entre que secciones lo pego O_O ?
postada no me referia a que si lo muevo y actualizara la pagina siga en su mismo lugar, no. :)
_______________________________________________________
hace unos dias me ayudaste a mover el link de comentarios
a la zona que quiera, el problema fue que parece que se movieron de todas las entradas en un lugar y yo me referia a que el link de comentarios de cada una de las entradas por separado.
Como el blog de Oloblogger.
Gracias por tu proxima respuesta.
Hola Forrito,
ResponderEliminarAunque eliminaste los comentarios pude leerlos en el correo.
Lamento tardar a veces en responder los comentarios, pero debes saber que además de tener este blog también tengo una vida personal que debo atender.
Te he dado varios códigos y enlaces donde se encuentra la información detallada de cómo hacer lo que quieres.
Mi responsabilidad hacia con el blog, es crear los tutoriales y publicarlos para que estén al alcance de todos y de la manera más entendible posible, pero no puedo hacer el trabajo que al usuario le corresponde.
En los enlaces que te de facilitado está la información que buscas, siento no poder hacer nada más para ayudarte.
Saludos.
entiendo u.u y no te podria pagar $ ? para recibir tu ayuda ? y terminar mi blog porfin.
ResponderEliminarNo Forrito, como te dije, yo sólo hago tutoriales.
ResponderEliminarSaludos.
yo entiendo creeme pero tambien creeme a mi que tampoco es facil rogar ayuda pero lo pido porque mi blog es importante para mi, quisiera terminarlo, llevo dias madrugando, se que no es tu obligacion ni te incumbe pero porfavor ayudame mi blog http://forritow.blogspot.com/ quiero borrarle del fondo los ojos al MUÑECO amarillo (BART)y agregar dos puntos arrastrables que empiezen desde ahi para que pueda ser interacitva su mirada y todos la puedan mover.
ResponderEliminargracias u.u
Hola Forrito,
ResponderEliminarNo creas que me rehúso a ayudarte, por el contrario, mi intención con este blog es ayudar, así que me he hecho un espacio para apoyarte con los ojos arrastrables.
Cambia la imagen que tienes de fondo por esta:
http://dl.dropbox.com/u/647003/bg_body%20%282%29.PNG
Luego pega antes de </head> el primer código que menciono en este post.
Por último busca la etiqueta <body> y debajo de ella pega esto:
<img id='ojo1' src='http://i50.tinypic.com/xnhp4l.png' style='cursor:move; border:0px; position:absolute; top:50px; left:510px;'/>
<script type='text/javascript'>new Draggable('ojo1');</script>
<img id='ojo2' src='http://i50.tinypic.com/xnhp4l.png' style='cursor:move; border:0px; position:absolute; top:50px; left:360px;'/>
<script type='text/javascript'>new Draggable('ojo2');</script>
Y listo, los ojos del muñeco se podrán arrastrar.
La imagen de fondo que te he dado súbela a Imageshack lo antes posible pues caduca en 12 horas.
Saludos.
Grasias !!! heee ! gracias Potro estoy saltando en un pie de la alegria pero pero U_U me caí cuando me di cuenta que funciona en IE y no en Chrome, ¿talvez habria una forma que funcione en los dos navegadores ?
ResponderEliminarhttp://img132.imageshack.us/img132/9903/dibujotxz.jpg
blog de pruebas http://dsadssdsadsa.blogspot.com/
veras yo voy a contratar la voz que doblo en mexico a Homero Simpsons para que de la bienvenida al blog pero no puedo hacerlo sin terminarlo.
Otra cosa tambien importante en estos dias estoy viendo que varios blogs se estan saludando por navidad y hace ratos que me pica la mano por hacerlo y felicitarte pero a mi no me gustaria que me digan feliz navidad antes de la navidad :).
oloblogger me dijo: Para dejar más espacio entre widgets:
En la parte CSS, insertar...
.widget-content {
margin-bottom:10px;
}
Donde es el Css? y si derrepente lo viste a mis widgets de abajo de etiquetas estan a la mitad que hago u.u ?
Leer más: http://oloblogger.blogspot.com/2009/12/tynt-para-controlar-la-copia-de-tus.html#comments#ixzz0aTNeDwMu
Under Creative Commons License: Attribution Non-Commercial Share Alike
Potro amigo saludos desde Perú.
Esto le explique a Oloman pero no explica las cosas tan bien como tu y la paciencia que tienes es Fabulosa :)
ResponderEliminarhttp://img63.imageshack.us/img63/923/dibujo5wb.jpg
porcierto no comentes a Oloman que algunas secciones se parecen a su blog le pregunte si podia hacerlo me dijo si pero cuando hablo con el soy Anonimo. :D
mi ultima pregunta era poner una imagen como lo hace Oloman
ResponderEliminarpero con la mia.
http://i180.photobucket.com/albums/x16/brian-tk/estrella.gif
asi
http://img707.imageshack.us/img707/93/21875734.jpg
intente esto pero no se donde ubicar cada Cosa y se me hace complicado.
http://img198.imageshack.us/img198/6213/dibujohjg.jpg
Este comentario ha sido eliminado por el autor.
ResponderEliminargracias, ya envie el correo.
ResponderEliminarEl arrastre "No me funciona con Mozilla Firefox" ¿Puedes resolverlo? Aguardo impaciente la respuesta, si lo deseas puedes enviármela a econenos@hotmail.com. Disculpas por incordiar.¡Feliz Año!. Un saludo. MaCaPe.
ResponderEliminarHola MaCaPe,
ResponderEliminarEl arrastre debe funcionar con todos los navegadores, yo lo he probado con cinco distintos y en todos ha funcionado.
Revisa que no sea la versión de tu navegador y/o que los códigos estén colocados correctamente.
Saludos y feliz inicio de año.
Muchas gracias por la prontitud,la versión es 3.5
ResponderEliminarHice otra prueba sólo con imágenes, eliminé una tabla por si intercedía en el código, pero no me funciona, será por algo que interfiere con el Scriptaculous,sólo son suposiciones,lamento que no poder utilizarlo,me gustaba ese código. Gracias mil MaCaPe.
Podría ser posible que sea que algo está interfiriendo con Scriptaculous. No estaría mal que lo hicieras en un blog de pruebas, así te darías cuenta si es por algún otro código que interfiere.
ResponderEliminarSaludos.
Efectivamente eso es, utilizo la misma plantilla en "Econenos naturaleza" y en esa no me dá error, en la de "Econenos continúa con error". Le miraré "las tripas" por si localizo el fallo. Un saludo y muchísimas gracias, si no lo consigo publicaré mis nuevos proyectos en otra plantilla y la enlazaré. Macape. Eres genial
ResponderEliminarOjalá encuentres el problema y se pueda solucionar. Si te decides por redireccionar el blog te dejo el enlace para hacerlo de manera sencilla:
ResponderEliminarRedireccionar un blog a otro blog
Saludos.
Hola potro, creo que dí con el error , pues se repite en las plantillas de los blogs que no me permiten realizar arrastres, en: econenos con el buscador Mozilla Firefox se aprecia en la cima del blog esta flecha -->( no sé si es en Middlebar o Linkbar). Yo no la encuentro para eliminarla, tal vez tu sepas por donde anda, en caso contrario, no te preocupes, no pierdas tiempo en ello, buscaré otra solución.Muchas gracias, un saludo. MaCaPe.
ResponderEliminarHola MaCaPe,
ResponderEliminarNo creo que ese sea el problema, esa flechita es de un comentario de la plantilla que debe estar "suelto". A mí me ha pasado algunas veces en unas plantillas y me vuelve loco porque me cuesta mucho trabajo encontrar dónde está el error.
Ojalá des con él y ten cuidado, no vayas eliminar algo.
Saludos.
Hola Potro: ¡Por fin lo encontré! Después de unas cuantas horas de copiar y pegar enlaces y demás "achinfánfanos" y antes de hacer el cambio de plantilla (tal vez tuviese que repetir de nuevo copia-pega), añadí la hoja de estilos del menú y de nuevo deja de funcionar, "el último elemento que miré",lo eliminé y tu código funciona a la perfección. Ayer suprimí directorios por un instante para comprobar fallo, las veces que aparece econenos disminuyó mucho, no sé si eso es significativo, controlo muy poco lo de ( popularidad y redes sociales,.. añadir metas...)Muchas gracias de nuevo, te invitaría a unos choricillos y un vino casero,..."Te mereces muchas cervecitas"
ResponderEliminarHola MaCaPe,
ResponderEliminarYa no entendí muy bien ¿el fallo estaba en los directorios?
Si es así entonces debía ser alguno que usara un script, pero no hay problema, el que quites los directorios de tu blog no afecta en nada la popularidad de tu blog. Simplemente hay días buenos y otros no tanto, así es esto de las visitas en un blog.
Pero me alegro que ya hayas resuelto el problema, yo por mi parte agregaré la palabra achinfánfanos a mi diccionario ;)
Un abrazo!
Hola Potro:
ResponderEliminarEl error lo producía el código css del "Menú". Ahora lo dejé sin él. La palabra "achinfánfanos", no creo que la encuentres en el diccionario, la uilicé para nombrar: cubos y otros recipientes para trasportar agua en una entrada del blog, así que si buscas esa pabra exraña sólo sale en uno de los blogs, esa enrada está en gallego: "Carrexando auga" y aquí la menciono"María, que así se chamaba, era unha cativa de catro anos, tódolos días carrexaba a auga dende a fonte ata a casa, tiña que encher tódolos achinfánfanos que estaban valeiros: cántaros, palanganas, baldes....día tras día controlaba que todo estivese cheo. Non era fácil, o camiño ata fonte pronto o facía, pero a volta era algo máis penosa. Poñia os baldes no caño da fonte, unha vez cheos, baixaba primeiro un e despois o outro, con tino para non verter a auga.", por eso no creo que e sea útil. Un saludo. Macape
Interesante... ;)
ResponderEliminarHola El Potro
ResponderEliminarNavegando me topé con una gran isla de scriptaculos:
http://wiki.github.com/madrobby/scriptaculous/
Esta bien interesante y es open source ¿la conoces? ¿son aplicables a blogger? Agradecería mucho tu apreciación sobre esto.
Gracias
Hola ABRIL,
ResponderEliminarInteresantes efectos, ya había visto algunos pero no todos.
Supongo que también pueden aplicarse en Blogger; la próxima semana hago los "experimentos" para ver si sale.
Gracias por compartirlo.
Saludos!
Vale!
ResponderEliminarMil gracias
Este comentario ha sido eliminado por el autor.
ResponderEliminarya lo probe y no me funciona, porque sera?
ResponderEliminarPorque usas JQuery, esa librería no es compatible con Scriptaculous, por eso no funciona.
ResponderEliminarSaludos.
hola , una consulta: (aun que no lo creas mientras me disponia hacerte la pregunta encontre la solucion) ni pregunta te la hare para aquellos que le pse lo mismo:
ResponderEliminar¿porque mi imagen se arrastra pero al soltarla regresa donde mismo?
el problema estaba en que copie tu link y utilice la misma url de la florecita que tienes mas arriba y no le quite el "drag 1" ...
luego pues le cambie el "drag" por otra palabra y solucionado.... sera que es porque como es la misma url de tu ejemplo no se puede usar la palabra "drag 1" porque ya esta usada para esa url de imagen... posiblemente
gracias por este gran blog... aun mis blog estan en fase de pruebas por eso no tengo contenidos... jejejeje cuando ya tenga todos lo que usare empezare a publicar espero mas te tus super post...
ResponderEliminarHola nEjO,
ResponderEliminarLa URL no tendría nada que ver, pero sí la palabra ID, en este caso drag1, aunque claro, si se usan varias imágenes sería mejor que cada una tuviera su propia URL y por supuesto su ID exclusiva.
Qué bueno que tú mismo pudiste encontrar la solución :)
Saludos!
HOLA POTRO VEO QUE USTED ES EL MEJOR DE AQUI QUISIERA QUE ME AYUDARA CON UNA INQUIETUD QUE TENGO
ResponderEliminarMIRA QUIERO UNA IMAGEN QUE SE VALLA BAJANDO EN LA PAGINA CADA QUE BAJAN LA PAGINA ES COMO UN TIPO BANERS
MI CORREO ES cesarsaenzhdez@msn.com por favo0r ayudame
ResponderEliminarEn estos días publico una entrada para explicar cómo hacerlo.
ResponderEliminarTe sugiero que te suscribas al feed para que estés enterado cuando se publique la entrada.
Saludos.
CREO QUE A DE SE LO MISMO QUE SE HACE CON EL LOGO DE FACEBOOK O TWITER http://ciudadblogger.com/2009/11/boton-para-compartir-por-twitter-y.html O EL DE IMAGEN FLOTANTE QUE SE CIERRA O QUE NO SE CIERRA... CREO QUE HABI PODRIA ESTAR LA RESPUESTA
ResponderEliminarNo entiendo la relación de arrastrar las imágenes con los botones de compartir (?)
ResponderEliminarmuy buen truco potro como siempre 10/10
ResponderEliminarlastima que yo uso opera y en este navegador no va el efecto :(
yo creo que lo pondre para mis dos lectores :D
Es una lástima, pero igual podrías tratar con JQuery en caso de que no uses Scriptaculous.
ResponderEliminarSaludos.
muchas gracias potro como siempre al pendiente de los comentarios de tu blog :)
ResponderEliminary pos no creo, por que tengo scriptaculous en muchas cosas :(
Ni hablar, ojalá que los demás truquillos que veas con Scriptaculous funcionen sin problema en Opera.
ResponderEliminarSaludos!
Oye en mi blog quiero poner easydrag pero no se puede
ResponderEliminarcomo phototype y todo el codigo blabla bla los codigos en la simagenes y todo eso pero no salen las imagenes para moverlas me aparece haci
draglink1" style="cursor:move; border:0px;" ondblClick="javascript:window.open('')" src="http://img155.imageshack.us/img155/8971/he1.png"/>
Easydrag es con jQuery no con Scriptaculous.
ResponderEliminarGeneralmente las funcionas Javascript (como el ondblClick) no funcionan directo en la plantilla, tienes que ponerlo en un elemento HTML/Javascript o una entrada.
Hola tengo una preguntota, espero y me puedas ayudar como haces para que una pagina estaica quede sin nada es decir fuera cabecera sidebar etc. asi como la que usaste en EasyDrag
ResponderEliminarEl ejemplo como es una plantilla antigua usé este método:
ResponderEliminarhttp://ciudadblogger.com/2010/02/ocultar-sidebar-en-las-paginas.html
Pero si usas una plantilla del Diseñador de Blogger entonces debes seguir este método:
http://ciudadblogger.com/2010/10/ocultar-sidebar-en-las-paginas.html
En cualquiera de los dos casos puedes añadir ahí mismo estilos para que otras áreas de la plantilla desaparezcan como la cabecera, el footer, etc.
Es basicamente lo que haríamos para ocultar elementos en distintas partes del blog:
http://ciudadblogger.com/2011/01/ocultar-gadgets-y-elementos-en.html
tio eres un crack, tendras algun efecto para en formularios seleccionar imagenes
ResponderEliminarUmmm nop.
ResponderEliminarque tal estimado...todo bien te pasaste...pero mi consulta es la siguiente ¿ como guardar los cambios de los movimientos hechos
ResponderEliminarNo tiene esa opción.
EliminarHola mi estimado nose si sigues por ahi, bueno queria preguntarte como hago para usar una imagen al darle click se posicione en un lugar especifico que yo quiera. haber es que quiero hacer algo asi como el test de raven http://www.avlisad.com.ar/test/index.php pero ya no con los radio buton sino directamente darle click a la imagen que se posicione en el lugar vacio y luego se vaya a la pagina siguiente, espero me puedas ayudar saludos.
ResponderEliminarNo sé bien cómo se haría de una manera compleja, pero algo sencillo sería de este modo:
Eliminar<label for="test1">
<img src="URL de la imagen" />
<input class="select_control" id="test1" name="test" type="radio" value="value1" />
</label>
<label for="test2">
<img src="URL de la imagen" />
<input class="select_control" id="test2" name="test" type="radio" value="value2" />
</label>
hola, acabo de dar con tu tutorial y era lo que buscaba, solo tengo una cosa, que ya tenía un efecto a parte y la onda de que este lo jale de google (google.load) genera que ya no me sirva mi otro plug in de jquery, si le quito google funciona todo lo demás, hay alguna manera para poder hacerlo funcionar ?
ResponderEliminarHola, he encontrado este tutorial que me ha quedado súper para lo que quiero, solo tengo un problema, este funciona jalando de google (google.load) y otras cosas que tenía funcionando con jquery han dejado de funcionar, solo quitando el google, funcionan todas, y pues menos esta, hay alguna manera de solucionar esto?
ResponderEliminarHola Rodrigo, si también usas jQuery entonces debes hacer unos ajustes a tu script de jQuery para que sea compatible con este:
Eliminarhttp://ciudadblogger.com/2011/02/usar-jquery-y-scriptaculous-al-mismo.html
gRACIAS!!
ResponderEliminarGracias!!
ResponderEliminarGracias Potro, ya me había dado por vencida, pero tu si que tienes todos los trucos necesarios, funciona perfecto.
ResponderEliminar