Want to create interactive content? It’s easy in Genially!

Reuse this genially

Tutorial personalizado basado en DND ADDA S'cape + Sandbox

Alfonso Peña

Created on November 26, 2022

Aprendemos desde cero cómo funciona la extensión DND que nos permite mostrar y hacer desaparecer elementos arrastrando y soltando unos elementos sobre otros

Start designing with a free template

Discover more than 1500 professional designs like these:

Transcript

Tutorial basado en la extensión DND ADDA de Sandbox Educación: https://sandboxeducacion.es/dnd-adda Las 5 últimas páginas están extraídas de ese Genially

CAJONES DE CÓDIGO VARIOS QUE TIENEN QUE ASOCIARSE A ELEMENTOS DE NUESTRAS PÁGINAS

EXTENSIONES

CEREBRITO

drag and drop-->arrastrar y soltar

Cuando ponga un elemento sobre otro aparezca un tercer elemento...

Cuando ponga un elemento sobre otro aparezca un tercer elemento... Pero solo cuando pulse sobre un botón de verificación

Cuando ponga un elemento sobre otro aparezca un tercer elemento... Pero solo cuando pulse sobre un botón de verificación. Y si no he acertado, que salga un mensaje temporal de error...

Cuando ponga un elemento sobre otro aparezca un tercer elemento... Pero solo cuando pulse sobre un botón de verificación, con botones personalizados

Comprobar

recomenzar

Cuando ponga un elemento sobre otro aparezca un tercer elemento... Pero solo cuando pulse sobre un botón de verificación, con botones personalizados

Comprobar

recomenzar

Cuando ponga un elemento sobre otro desaparezca un tercer elemento...

¡A ver si lo consigues!

Cuando ponga un elemento sobre otro desaparezca un tercer elemento... Y aparezcan varios más...

¡¡¡Conseguido!!!

¡A ver si lo consigues!

Cuando ponga un elemento sobre otro aparezca un elemento y desaparezca otro elemento, pero al volver a quitarlo desaparezca el elemento que apareció y aparezca el elemento que desapareció.

¡A ver si lo consigues!

Que haya dos grupos de arrastre, y cuando se cumplan las dos condiciones aparezca un elemento y desaparezca otro

Lo has conseguido al menos una vez

CONSIGUE LA PASTA

Lo has conseguido al menos una vez

Cuidado con la pasta

comprobar

Caja de la ONU

Mete 5 países

[5]

rnd

comprobar

Caja de la ONU

Mete $C1 países

[1-5]

500
*500
100
*100

comprobar

200
*200

Caja de la ONU

1000 millones € de inversión en ODS
900
*900
100
*100
50
*50

%[1000]

10
*10
200
*200
100
*100
400
*400
300
*300
100
*100
500
*500
100
*100

comprobar

200
*200

Caja de la ONU (aletorio)

%C1 millones € de inversión en ODS
900
*900
100
*100
50
*50

%[200-1000]

10
*10
200
*200
100
*100
400
*400
300
*300
100
*100
100
*100
100
*100
100
*100
100
*100
100
*100
100
*100
100
*100

%C1 PAÍSES

Sumando elementos

500
100
200

%[1-5]

comprobar

900
100
50
10
200
100

%C2 PAÍSES

%[1-5]

%TC PAÍSES

400
300
100

rnd, HLP: 3

comprobar

Une silueta con nombre

españa

italia

portugal

india

grecia

GLOBAL_OFFON DESAPARECE SÓLO CUANDO TODOS LOS OBJECT ESTÁN EN SUS CIBLE

rnd, precision

GLOBAL_ON APARECE SÓLO CUANDO TODOS LOS OBJECT ESTÁN EN SUS CIBLE

CORRECTION CEREBRO QUE DEVUELVE LOS OBJECT A SU POSICIÓN INICIAL

FONCTION ES EL CEREBRO, SIN ÉL NADA FUNCIONA. 1 Decimales, precisión del cible, rnd mezclar

OBJET1

Los CIBLE son los recipientes donde tendremos que llevar los OBJECT

GLOBAL_ONOFF

GLOBAL_ON

GLOBAL_OFF

GLOBAL_OFFON

CIBLE1

OBJET2

ON APARECE CUANDO SU OBJECT ESTÁ EN SU CIBLE

OFF DESAPARECE CUANDO NO ESTÁ SU OBJECT EN SU CIBLE

WRONG_ON APARECE CUANDO NO ESTÁN TODOS LOS OBJECT EN SUS CIBLE, YA NO DESAPARECE

ONOFF1

OFFON1

OFF1

ON1

WRONG_TEMP APARECE SI NO CUANDO NO ESTÁN TODOS LOS OBJECT EN SUS CIBLE Y DESAPARECE SI DEJÁN DE ESTARLO

OFFON DESAPARECE CUANDO EL OBJECT ESTÁ EN SU CIBLE Y APARECE CUANDO NO ESTÁ.

CIBLE2

ONOFF APARECE CUANDO EL OBJECT ESTÁ EN SU CIBLE Y DESAPARECE CUANDO NO ESTÁ.

OBJET3

WRONG_ON

ON2

OFF2

OFFON2

ONOFF2

REASIGNAR SIRVE PARA MEZCLAR LAS POSICIONES DE LOS OBJET

WRONG_TEMP

ODD OBJET

CIBLE3

OFF3

ON3

OFFON3

ONOFF3

VERIFICATION SIRVE PARA VERIFICAR SI LOS OBJET ESTÁN EN SUS CIBLE

RECOMMENCER SIRVE PARA REINICIAR TODO

Mezclar

Comprobar

Powered by

TUTORIALES

1, precision, rnd

Más opciones de tiempo para WRONG TEMP

Aquí encuentras los scripts para completar las series de elementos hasta el número deseado.

Únicamente habrá que cambiar los números (en el ejemplo el 21) por el deseado. Una vez modificado, copiaremos uno a uno en el cuadro de la pestaña Insertar </> Otros y pulsaremos el botón INSERTAR.

<div style="width:100%;height:100%;text-align:center;color:white;background-color:tomato" data-auteur="scape" data-ref="objet" class="objet21" data-num="21">OBJET21</div><script></script>

<div style="width:100%;height:100%;text-align:center;color:white;background-color:tomato" data-auteur="scape" data-ref="cible" class="cible21" data-num="21">CIBLE21</div><script></script>

<div style="width:100%;height:100%;text-align:center;color:white;background-color:tomato" data-auteur="scape" data-ref="on" class="ON21" data-num="21">ON21</div><script></script>

<div style="width:100%;height:100%;text-align:center;color:white;background-color:tomato" data-auteur="scape" data-ref="off" class="OFF21" data-num="21">OFF21</div><script></script>

<div style="width:100%;height:100%;text-align:center;color:white;background-color:tomato" data-auteur="scape" data-ref="on" class="ONOFF21" data-num="21">ONOFF21</div><script></script>

<div style="width:100%;height:100%;text-align:center;color:white;background-color:tomato" data-auteur="scape" data-ref="off" class="OFFON21" data-num="21">OFFON21</div><script></script>