Dragging Items

The only way to add draggable objects using plain Lectora functionality is to add a D&D question. Note that you don't have to create a test, you can simply add a question on any page. You will be able to select draggable items, their landing spots as well as access the results of what's-dragged-where via the question variable.

Alternatively, you can use external scripting. I recommend jQuery UI Draggable (see this: http://trivantis.com/blog/using-jquery-lectora-customize-e-learning-courses-part-3/) or Greensock Draggable (see this: https://greensock.com/draggable).

Hi Sergey

I Am having some trouble getting Greensock Draggable to work. These are the steps I followed. Installed the Draggable.js file at the title level as an external file as a header object.

Then place an action to run the javascript code (with Lectora object ID) supplied by greensock on the object I wanted dragged.

Is that correct? If not do you have a Lectora file with something similar can I take a look at it please.

Your assistance is much appreciated.

Thanks

Dan

undefined

Hi Sergey

Thanks. However I don't see how I can open any of those files in Lectora...

What I would like if possible is that draggable example above in a Lectora .awt format. This way I can see how it is put together. This will help as I have followed a bunch of tutorials but still can't get it to work.

I appreciate your help Sergey

Regards

Dan

Here's a demo: https://dl.dropboxusercontent.com/u/11433463/trivantis/draggable/html/index.html

Here's the source file: https://dl.dropboxusercontent.com/u/11433463/trivantis/draggable/draggable.zip

So you have to add all the library scripts to an external object set to META TAGS. Then, in an "On Show" action on page or on particular objects, you execute the Draggable.create("#text89undefined#image102undefined. Also, note that if you have an action attached to a draggable object, the action will fire as soon as you drop the dragged item.

The second link above contains the Lectora title.

Hi Sergey,

Thanks for taking the time to send that information through. That is exactly what I want to recreate. Is it possible to send through the Lectora Title so that I can unpack it that way?

Thanks again

Dan

undefined

The zipped file contains the AWT file. Download it. Unzip it. Open the AWT in Lectora.

Hi Sergey

Thanks for the Lectora file and all your other advice it has been very helpful. I have been able to get the drag effect to work.

I have another question if you have the time. I now have a really nice draggable custom png magnifying glass. Is there anyway to make this image the cursor for a Lectora page. Now I am not talking about the little pixelated icon other threads discuss but an actual image.

The problem I am having now is trying to get the draggable object to trigger actions to make thinks appear when over the top.

Probably not possible but just checking to see if you have heard anything like this being done.

Thanks

Again

Dan

undefined

Allthough this isnot the appropriate spot to post this, i cannot find a way to send a user a sample awt directly without either adding it to a post ( like now ) or sharing it to the community.

This is for Daniel Carroll. Hi Dan, setup a simple question that should work like you asked for before..

Kind regards,

Math

Hi Dan,

Adapted the sample to show the incorrect/correct answers a user choose on the false page.

Kind regards,

Math