Blog

PRUEBAS INICIALES

Entrada destacada

PÁGINA DE BIENVENIDA

PÁGINA DE BIENVENIDA

TRUCO PARA QUE LAS IMÁGENES SE MUEVAN CON EL MAUS

by - marzo 03, 2020

TRUCO PARA QUE LAS IMÁGENES SE MUEVAN CON EL MAUS
"BLOGS FAMAG "





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:

Para implementarlo en vuestro Bloc solo tenéis que seguir estos pasos:



 Un clic en “Plantilla”



 Un clic en “Editar HTML”



Ahora se te abrirá el editor HTML de tu plantilla, se mostrara igual como la imagen que esta a continuación



En este punto deberás presionar la tecla “Control” de tu teclado seguido de la tecla “F” para que aparezca el buscador integrado en la parte superior derecha de tu editor,
debes esperar unos segundos hasta que se muestre, aquí es donde tendrás que insertar el código para buscarlo e insertar los códigos correspondientes en el editor,
a continuación mire la imagen la cual te mostrara tal y cual deberá aparecerte el buscador en tu editor HTML de tu plantilla y así puedas colocar el código en el buscador al momento que yo diga busca este código.




 Coloca este código en el buscador y dale un "Enter"


</head>



Inserta las siguientes líneas de código justo arriba (ó antes) del código que encontraste






<!-- 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 azul, 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.

You May Also Like

0 Comments

Paginacion