Home >Web Front-end >H5 Tutorial >HTML5+jQuery实现支持桌面和移动拖动iPhone风格插件

HTML5+jQuery实现支持桌面和移动拖动iPhone风格插件

WBOY
WBOYOriginal
2016-05-17 09:08:141661browse


  当我们为Web创造的东西,现在它是非常重要的,我们还记得网络已经从触摸板鼠标蔓延到触摸屏。有时候这是很难适应的,但经过不断努力创造一些真棒交叉设备友好的触摸和拖动!现在让我们用HTML5+jQuery实现支持桌面和移动拖动iPhone风格插件。

HTML5+jQuery实现支持桌面和移动拖动iPhone风格插件

源码下载  在线演示

代码:

<script></script>

$(document).ready(function() {

    $('.content').dragSensitive({

        // The length of every row. Default is 10 items per row

        rowLength : 10,

        // The default width of the box.

        boxWidth  : 660,

        // The default height of the box.

        boxHeight : 500,

        // The rate at which grabbing pans across items

        // The default is 1.3. Increasing makes it go slower.

        rate      : 1.3,

        // Sets whether or not the UI will snap to the last

        // element when the user stops grabbing

        round     : true,

        // This amount a user can drag (in pixels) while still

        // being able to click an object. Usually clicking is

        // disabled on drag, but within a (by default) 20px movement

        // clicking will still be enabled

        mistake   : 20

    });

 });

 

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn