Skip to main content
Dirlo
Dirlo
Inspiring
January 24, 2018
Question

Dragging an object using Jquery

  • January 24, 2018
  • 1 reply
  • 907 views

...

Hi all !...

I'm still having a problem with the dragging (and rotating) function...

(See here my previous post : Rotate an image with a button in html5 )

So now I think I have to try to avoid the Captivate's Widget dragging function and try to drag my object using JQuery.

My object's name is "Regle_3".

So I try to add a javascript function in the opening of my slide :

I try many options (I'm not a pro in Js !!...) :

$("[id='Regle_3c']").draggable();

$( "#Regle_3" ).draggable();

$( "#Regle_3c" ).draggable();

But without any success so far... So is it possible to drag an object with Jquery in Captivate ? And how ?...

Thanks a lot !...

...

    This topic has been closed for replies.

    1 reply

    Dirlo
    DirloAuthor
    Inspiring
    January 25, 2018

    ...

    It's me again !...

    I'm becoming desperate about this question...

    I try to add jquery-1.12.4.js and jquery-ui.js in the project... (as I did with JQueryRotate.js)...

    I try many options with the coding... and still didn't manage to drag anything...

    Please, just let me know if it's possible (or not !??)... and if it exists a link or a clue to help my mind !...

    Thx in advance !...

    ...

    RodWard
    Community Expert
    RodWardCommunity Expert
    Community Expert
    January 25, 2018

    If you are testing this by just playing the content locally from your hard drive, THAT might be why it's not working.

    Try testing from a web server.

    Dirlo
    DirloAuthor
    Inspiring
    January 25, 2018

    ...

    Thx Rod for your answer !...

    But I think it's in the javascript code that there is a problem...

    What I did so far :

    - I use this resource : https://jqueryui.com/draggable/

    (So I download both "jquery-1.12.4.js" and "jquery-ui.js")

    In captivate (last version), in a slide, I put a rectangle form, which I name "drag".

    In the opening action panel of the slide, I put the javascript code : $( "#drag" ).draggable();

    (And try also many other options without the #, or with a c "dragc" and many others...)

    Then I publish my project...

    Then I add in the assets/js folder the two js files I have downloaded previously.

    Then I change the code of the index.html file of the project, adding the links to the js files :

    var lJSFiles = [  'assets/js/jquery-1.11.3.min.js','assets/js/CPM.js','assets/playbar/playbarScript.js','assets/js/jquery-1.12.4.js','assets/js/jquery-ui.js' ];

    So I think everything is ok on my hard drive ???... (previously with the RotateJs, I didn't need to put it on a web server and it was ok !)

    So I think the problem is in the javascript code I put in the opening action panel... ???

    $( "#drag" ).draggable();

    (And I don't want to try all the versions I tried on a web server before being sure of the javascript coding... (I tried so many options !!!...))

    So what's wrong ?...

    ...

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices