jQuery iScroll.js 移动端滚动条美化插件第3/5页

 更新时间:2016年02月25日 15:53:43   作者:starof  
这篇文章主要介绍了jQuery iScroll.js 移动端滚动条美化插件的相关资料,需要的朋友可以参考下
; sizeY = m.abs(y - that.pagesY[that.currPageY]); sizeY = sizeY ? m.abs(that.y - y) / sizeY * 500 : 0; that.currPageY = page; // Snap with constant speed (proportional duration) time = m.round(m.max(sizeX, sizeY)) || 200; return { x: x, y: y, time: time }; }, _bind: function (type, el, bubble) { (el || this.scroller).addEventListener(type, this, !!bubble); }, _unbind: function (type, el, bubble) { (el || this.scroller).removeEventListener(type, this, !!bubble); }, /** * * Public methods * */ destroy: function () { var that = this; that.scroller.style[transform] = ''; // Remove the scrollbars that.hScrollbar = false; that.vScrollbar = false; that._scrollbar('h'); that._scrollbar('v'); // Remove the event listeners that._unbind(RESIZE_EV, window); that._unbind(START_EV); that._unbind(MOVE_EV, window); that._unbind(END_EV, window); that._unbind(CANCEL_EV, window); if (!that.options.hasTouch) { that._unbind('DOMMouseScroll'); that._unbind('mousewheel'); } if (that.options.useTransition) that._unbind(TRNEND_EV); if (that.options.checkDOMChanges) clearInterval(that.checkDOMTime); if (that.options.onDestroy) that.options.onDestroy.call(that); }, refresh: function () { var that = this, offset, i, l, els, pos = 0, page = 0; if (that.scale < that.options.zoomMin) that.scale = that.options.zoomMin; that.wrapperW = that.wrapper.clientWidth || 1; that.wrapperH = that.wrapper.clientHeight || 1; that.minScrollY = -that.options.topOffset || 0; that.scrollerW = m.round(that.scroller.offsetWidth * that.scale); that.scrollerH = m.round((that.scroller.offsetHeight + that.minScrollY) * that.scale); that.maxScrollX = that.wrapperW - that.scrollerW; that.maxScrollY = that.wrapperH - that.scrollerH + that.minScrollY; that.dirX = 0; that.dirY = 0; if (that.options.onRefresh) that.options.onRefresh.call(that); that.hScroll = that.options.hScroll && that.maxScrollX < 0; that.vScroll = that.options.vScroll && (!that.options.bounceLock && !that.hScroll || that.scrollerH > that.wrapperH); that.hScrollbar = that.hScroll && that.options.hScrollbar; that.vScrollbar = that.vScroll && that.options.vScrollbar && that.scrollerH > that.wrapperH; offset = that._offset(that.wrapper); that.wrapperOffsetLeft = -offset.left; that.wrapperOffsetTop = -offset.top; // Prepare snap if (typeof that.options.snap == 'string') { that.pagesX = []; that.pagesY = []; els = that.scroller.querySelectorAll(that.options.snap); for (i=0, l=els.length; i<l; i++) { pos = that._offset(els[i]); pos.left += that.wrapperOffsetLeft; pos.top += that.wrapperOffsetTop; that.pagesX[i] = pos.left < that.maxScrollX ? that.maxScrollX : pos.left * that.scale; that.pagesY[i] = pos.top < that.maxScrollY ? that.maxScrollY : pos.top * that.scale; } } else if (that.options.snap) { that.pagesX = []; while (pos >= that.maxScrollX) { that.pagesX

相关文章

  • JQuery学习总结【二】

    JQuery学习总结【二】

    本文主要介绍了JQuery的基本知识,如:JQuery的dom操作,动态创建dom节点,删除节点,document方法等等,文章篇尾处附上实例小练习。需要的朋友可以参考下
    2016-12-12
  • jQuery实现的fixedMenu下拉菜单效果代码

    jQuery实现的fixedMenu下拉菜单效果代码

    这篇文章主要介绍了jQuery实现的fixedMenu下拉菜单效果代码,通过自定义fixedMenu方法实现点击下拉菜单效果,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-08-08
  • 适用于手机端的jQuery图片滑块动画

    适用于手机端的jQuery图片滑块动画

    这篇文章主要为大家分享了适应手机端的jQuery图片滑块动画,不仅在PC浏览器上可以使用,而且更适合在手机端的网页中使用,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • jQuery实现图片向左向右切换效果的简单实例

    jQuery实现图片向左向右切换效果的简单实例

    下面小编就为大家带来一篇jQuery实现图片向左向右切换效果的简单实例。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • 7个有用的jQuery代码片段分享

    7个有用的jQuery代码片段分享

    这篇文章主要介绍了7个有用的jQuery技巧分享,本文给出了在新窗口打开链接、设置等高的列、jQuery预加载图像、禁用鼠标右键、设定计时器等实用代码片段,需要的朋友可以参考下
    2015-05-05
  • jQuery实现简单轮播图效果

    jQuery实现简单轮播图效果

    这篇文章主要为大家详细介绍了jQuery实现简单轮播图效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • jQuery Tools tooltip使用说明

    jQuery Tools tooltip使用说明

    老规矩,先上html和css,还是用官方的,只是去掉了些东西
    2012-07-07
  • jQuery动态添加与删除tr行实例代码

    jQuery动态添加与删除tr行实例代码

    最近由于项目的需要,需要动态的添加和删除table中的tr,感觉用JS可以实现,但是在网上找了一下,单纯的自己写JS,感觉太麻烦,而且也不好维护。于是想到了最近学的jQuery。这篇文章给大家用实例介绍了jQuery动态添加与删除tr行的方法,有需要的朋友们可以参考借鉴。
    2016-10-10
  • jquery.uploadifive插件怎么解决上传限制图片或文件大小问题

    jquery.uploadifive插件怎么解决上传限制图片或文件大小问题

    jQuery.uploadifive插件可以很好的解决上传限制图片或文件大小问题,具体实例代码大家参考下本文
    2017-05-05
  • jQuery判断div随滚动条滚动到一定位置后停止

    jQuery判断div随滚动条滚动到一定位置后停止

    这篇文章主要介绍了jQuery判断div随滚动条滚动到一定位置后停止的方法,需要的朋友可以参考下
    2014-04-04

最新评论