JQuery UI draggable/droppable not working in responsive

nixthenext

I'm trying to build an interaction where the user must drag a number of things to a single drop zone. I've built it using JQuery UI (draggable), and it's working perfectly in a non-responsive course - but it fails in a responsive course.

I don't need this interaction to be responsive (I will just do something else for the other layouts), but I'd really like it to work for the desktop view-

What are my options??

wheels

Have you tried disabling browser resize of published content?  That keeps the desktop view from resizing, and might fix the issue.  You will want to leave the options to scale content off also.  Give it a try.

 

nixthenext

I see i'm in the wrong forum now... I don't see that option - I'm using Lectora Inspire 16 (desktop). Also, this is a responsive course - I generally want the page to resize when the browser resizes... what does checking this box do to a responsive course?

raungnaing

The issue is that the swipe library Hammer is conflicting with the jQuery draggable. Hammer gets included and initialized by default for RCD titles. Also in non-RCD titles, if you have swipe actions draggable will not work either.

To fix this you can disable Hammer in non-mobile environment by adding the following code in HTML extension type "Header Scripting" which will override the init function with an empty function.

if ( !isMobile.any() )
  initGEV = function() {}

For Lectora Inspire/Publisher users:

if ( !is.isMobile.any() )
  initGEV = function() {}

nixthenext

WOW!! Thank you so much, that worked perfectly! I wish I could give you more than 1 point for that one!

-Becky