开发者

JS library (with drag n drop) compatible with iOS and regular browsers

Does anyone know of a JS framework that has drag and drop functionality and is compatible with mobile (iOS) and regular browsers?

I currently have a 开发者_高级运维web-based app and it is a hassle to make its drag'n'drop functionality work on iOS... I wish there was one that would do it for both...


Here's two built in jQuery:

http://www.stevefenton.co.uk/cmsfiles/assets/File/mobiledragdrop.html

http://code.google.com/p/jquery-ui-for-ipad-and-iphone/

There is also the jquery mobile framework (which does not have drag and drop nativly): http://jquerymobile.com/


I'm a big fan of Sencha Touch.

Here's there drag and drop demo - http://dev.sencha.com/deploy/touch/examples/dragdrop/.

Note: Tested on my iPhone 4 in Safari.


JQuery Mobile is trying to support a large variety of platforms

And here is a specific plugins for Drag and Drop


Try dojo. It works pretty well and it is a relatively mature toolkit. http://dojotoolkit.org/


Check out SproutCore. It's a framework created by former Apple engineers and is used by Apple in MobileMe and iCloud web apps. It has SC.Drag which works with both mouse and touch events.


interact.js is a standalone and lightweight drag-and-drop, resize and multi-touch gesture javascript module. It works on iOS, Android, Chrome, Firefox, Opera and IE9+ with support for interacting with HTML and SVG elements. Something to note in advance is that it's up to the developer to respond to drag events but I think that's a good thing.

To allow the whole page to be panned by dragging, you could use:

// make an Interactable of the document body element
interact(document.body)
// make a draggable of the Interactable
  .draggable({
    // on(drag)move
    onmove: function (event) {
      x += event.dx;
      y += event.dy;

      // translate the document body by the change in pointer position
      document.body.style.translate = 'translate(' + x + 'px, ' + y + 'px)';
    }
  })


http://www.kendoui.com/ this should work. Has d'n'd too, even though it's still in Beta.


  • zepto (smallest, iOS 4+, Android 2.2+, webOS 1.4.5+)
  • jquery, jquerymobile, jqtouch
  • prototype
  • sencha, senchatouch


You can use jquery UI for drag and drop and an additional library that maps touch events to their mouse event analogs.I think this should solve your problem:

https://github.com/yeco/jquery-ui-touch-punch

To add touch events, just include the jquery.ui.touch-punch.min.js script after your jquery.ui scripts.

DEMOS:

http://furf.com/exp/touch-punch/


I'm not sure if its exactly what you're looking for, but you could try PhoneGap or maybe XUI.


If you are building web apps for ios you must try jquery mobile.


hi there i use this jquery plugin: https://github.com/LuvDaSun/jdrag

It provides some drag events

let me know if you find any bugs, the code is quite new!


This is still in alpha: http://prettydiff.com/jsgui

It is persistent even after you close or refresh your browser and it will work in any modern browser. Furthermore it is not a framework. You can use this without other frameworks and you can customize it to do what you want.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜