Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Smooth scrolling, rotation, pull to refresh, page transition and any motion for the web - 丝般顺滑的触摸运动方案

License

NotificationsYou must be signed in to change notification settings

AlloyTeam/PhyTouch

Repository files navigation

丝般顺滑的触摸运动方案

Smooth scrolling, rotation, pull to refresh and any motion for the web.

Install

npminstallphy-touch

Usage

varphyTouch=newPhyTouch({touch:"#wrapper",//反馈触摸的domvertical:true,//不必需,默认是true代表监听竖直方向touchtarget:{y:0},//运动的对象property:"y",//被运动的属性min:100,//不必需,运动属性的最小值max:2000,//不必需,滚动属性的最大值sensitivity:1,//不必需,触摸区域的灵敏度,默认值为1,可以为负数factor:1,//不必需,表示触摸位移运动位移与被运动属性映射关系,默认值是1moveFactor:1,//不必需,表示touchmove位移与被运动属性映射关系,默认值是1step:45,//用于校正到step的整数倍bindSelf:false, maxSpeed:2,//不必需,触摸反馈的最大速度限制value:0,change:function(value){target.style.transform="translate(0,"+value+"px)"target.style.webkitTransform="translate(0,"+value+"px)"},touchStart:function(evt,value){},touchMove:function(evt,value){},touchEnd:function(evt,value){},tap:function(evt,value){},pressMove:function(evt,value){},animationEnd:function(value){}//运动结束})

通过对象的实例可以自行运动DOM:

phyTouch.to(value,time,ease)
  • value是必填项
  • time是非必填项,默认值是600
  • ease是非必填项,默认值是先加速后减速的运动函数,CSS版本默认值是cubic-bezier(0.1, 0.57, 0.1, 1)

通过对象的实例可以自行停止DOM运动:

phyTouch.stop()

Demo(Mobile)

Related links

License

This content is released under theMIT License.

About

Smooth scrolling, rotation, pull to refresh, page transition and any motion for the web - 丝般顺滑的触摸运动方案

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors12


[8]ページ先頭

©2009-2025 Movatter.jp