ActivePresenter Saola Animate Pricing Download

Responsive Drag and Drop question

Hello everybody,

unfortunately the drag and drop quiz in your examples (Find the favorite foods for animals)
ist not responsive.

  1. Is there a responsive drag and drop example anywhere?

  2. Do all drag and drop boxes of a question have to be in the SAME container?
    Or is there a way to put them to different flexboxes? This would make the responsive work easier.

Hi Mike,

All drag and drop boxes of a question have to be in the same group/container. In the current version, there is no way to put them to different flex boxes.
Below is a responsive drag and drop project for your reference.

Regards

Drag-n-Drop_responsive.approj (3.9 MB)

Cool example. The layout works fine for me.

Unfortunately there is no Submit Button.
I need the same submit button like in the “Favorite foods for animals” example.

I added a new submit button but in the events panel I can not choose “Drag and drop question”.

How can I link the questions with the button?

Hi Mike,

In the previous project, I used Drop Area object to create drag-n-drop interaction, that’s why you didn’t see the Submit button.

Here is another project that I used Drag-n-Drop question to create. Please take a look at this and if you have any questions, kindly let me know.
Find_foods_animals_responsive.approj (3.6 MB)

Regards

Thanks for the new example.
How can the drag and drop box keep its size?

My Text Box does not grow/shrink. So should the drag/drop box.

I sent my work example in an email to support.

Hi,

If you want an object to keep its size, you have to set the width/height unit of that object to px in all layouts.
Otherwise, if you want an object to grow/shrink, you have to set its width/height unit to %.

In responsive project, you need to edit objects in each layout and then you can drag the handle along the responsive bar to preview the content.

Please refer to this tutorial to get detailed information:https://atomisystems.com/tutorials/ap8/how-to-insert-and-manage-objects-in-responsive-projects/

Regards

Thank you. That worked. Size is fix now. :slight_smile:

How can the drag and drop box keep its POSITION?
I want it to stay in the horizontal center when the browser gets smaller. Right now it starts moving to the left fromt 1240px to 1024px.

I could put the drag and drop box into a flexible box but then all objects positions and sizes get twisted.