zoukankan      html  css  js  c++  java
  • SlipJs API详细

    refresh(core_width, width):

    当在滚动对象的大小发生改变时(如:当用户滚动到底部时你通过ajax加载新内容,这时元素的尺寸会改变)必须调用refresh方法。主要用处是让SlipJs及时感知尺寸的变化以便正常工作。

    // 参数说明:这两个参数都是可选的。
    // core_ 滑动元素的宽度或者高度,单位为px(横向滑动时传递宽度,纵向滑动时传递高度)
    //       滑动元素的父级元素的宽度或者高度,单位为px(横向滑动时传递宽度,纵向滑动时传递高度)
    // 例如:
    var slipjs = slipjs('px',core);
    
    // 当元素的尺寸改变时,我们需要将新的尺寸给refresh:
    slipjs.refresh(1000,400);
    // 也可以不传递参数,这时SlipJs将自己通过获取元素的实际尺寸。

    toPage(num, time):

    page换屏状态下是用toPage可以滑动到指定屏数。

    // 参数说明:
    // num  : 要到达的屏数
    // time : 设定过程花费的时间,单位ms
    // 例如 :
    var slipjs = slip('page', core, {
        num: 3
    });
    
    // 这时我们想要用3秒的时间缓慢地轮换到第3屏就可以这样:
    slipjs.toPage(3, 3000); 

    that.page

    可在page换屏状态的startFun  moveFun  touchEndFun  endFun 这4个函数中获取当前所在的页(屏)数。

    function end() {
        alert(this.page);// 在滑动结束后输出当前的页(屏)数
    }
    slip('page', bar_list_div, {
        num: 3,
        endFun: end
    });

    提示:该api在图片轮换中导航小点的变化需要用到该api。

    注释:关于startFun  moveFun  touchEndFun  endFun 这4个函数的用法详见:SlipJs快速使用教程

    this.xy

    当你想在 startFun  moveFun  touchEndFun  endFun 这4个函数中获取滑动元素的坐标时可直接使用 this.xy 来获取,当状态为横向滑动时该值是滑动元素的x坐标,当状态为纵向滑动时该值是滑动元素的y坐标。

    例如:

    function move() {
        console.log(this.xy);// 在滑动过程中输出滑动元素当前的y坐标
    }
    slip('px', bar_list_div, {
        moveFun: move
    });

    提示:该api在“下拉刷新”的例子中使用到,在加载数据时非常有用。

    this.wide_high(3.0.1开始支持)

    当你想在 startFun  moveFun  touchEndFun  endFun 这4个函数中获取滑动元素的宽或者高(横向滑动的时候是宽,上下滑动时是高)可直接使用 this.wide_high来获取,当状态为横向滑动时该值是滑动元素的width,当状态为纵向滑动时该值是滑动元素的height。例如:

    function move() {
        console.log(this.wide_high);// 在滑动过程中输出滑动元素当前的y坐标
    }
    slip('px', bar_list_div, {
        moveFun: move
    });

    this.parent_wide_high3.0.1开始支持)

    当你想在 startFun  moveFun  touchEndFun  endFun 这4个函数中获取滑动元素父级元素的宽或者高(横向滑动的时候是宽,上下滑动时是高)可直接使用 this.parent_wide_high来获取,当状态为横向滑动时该值是父级元素的width,当状态为纵向滑动时该值是父级元素的height。例如:

    function move() {
        console.log(this.parent_wide_high);// 在滑动过程中输出滑动元素当前的y坐标
    }
    slip('px', bar_list_div, {
        moveFun: move
    });

    backward和forward(3.5.0开始支持)

    以图片轮换为例,现在你想要添加两个按钮,一个按钮为“上一张”,另一个为“下一张”,那么这是你就可以是使用backward和forward了,具体使用方法如下:

    var slip_img = slip('page',change_screen_ul,{
            change_time: 5000,
                          num: 3
    });
    document.getElementById("backward").onclick = function(){
        slip_img.backward(); // 上一张
    }
    document.getElementById("forward").onclick = function(){
        slip_img.forward(); // 下一张
    }

    其他相关文章:SlipJs快速使用教程

    或许你有更多关于SlipJs api的想法,欢迎同时感谢把你的建议写成邮件给送我,398791472@qq.com

  • 相关阅读:
    Java程序:从命令行接收多个数字,求和并输出结果
    大道至简读后感
    大道至简第一章读后感Java伪代码
    Creating a SharePoint BCS .NET Connectivity Assembly to Crawl RSS Data in Visual Studio 2010
    声明式验证超时问题
    Error message when you try to modify or to delete an alternate access mapping in Windows SharePoint Services 3.0: "An update conflict has occurred, and you must re-try this action"
    Upgrading or Redeploying SharePoint 2010 Workflows
    Upgrade custom workflow in SharePoint
    SharePoint 2013中Office Web Apps的一次排错
    How to upgrade workflow assembly in MOSS 2007
  • 原文地址:https://www.cnblogs.com/haoming/p/2917151.html
Copyright © 2011-2022 走看看