位置: 编程技术 - 正文

javascript Slip.js实现整屏滑动的手机网页

编辑:rootadmin

推荐整理分享javascript Slip.js实现整屏滑动的手机网页,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

有了Slip.js,你只管写HTML,CSS,如果逻辑简单,一行JS代码就可以搞定,大大提升了开发的效率。不吹牛,上面的demo,不到半小时我就写好了。

具体怎么做呢?比如有个需求是:

我们有4个页面,每个页面有一张图片,每次手指滑动都切换一整屏。

首先看HTML:

最后看JS:

javascript Slip.js实现整屏滑动的手机网页

解说:

Slip:暴露到全局的方法,只要你引入slip.js,就可以得到这个实用牛逼的方法。 container: 被滑动的容器,里面是每个滑动页面。 'y': 页面滑动的方向,你也可以传入'x'。 webapp: 设置页面展现为全屏滑动页面的方法。 pages: 页面元素列表。

说好的一行代码搞定的:

Slip(document.getElementById('container'), 'y').webapp();可以发现,上面的一行代码并没有定义pages:

当webapp方法不传递参数的时候,Slip会获取container的直接子元素(儿子元素)作为pages。

至此,一个全屏滑动网页就完成了,难以想象的简单快速。我用半小时,你分钟应该就可以。

当然:Slip.js还有很多更强大的功能,比如你可以自己定义页面滑动时要做什么,PM看你完成的这么快,就给你加了很有意思的需求:

当页面滑动到最后一页的时候,刷新一下。。。

你只需要加几行代码就可以搞定:

看,是不是很简单,是不是还没来得及抱怨这个需求,就已经完成它了,是不是有种前所未有的快感。

标签: javascript Slip.js实现整屏滑动的手机网页

本文链接地址:https://www.jiuchutong.com/biancheng/386274.html 转载请保留说明!

上一篇:javascript巧用eval函数组装表单输入项为json对象的方法

下一篇:一不小心就做错的JS闭包面试题(一不小心做错事男朋友就开始说我)

  • 电子税务局财务报表怎么更正申报
  • 一般纳税人哪些可以开3%的发票吗
  • 纳税人异地预缴税款
  • 保障性住房土地增值税预征
  • 公对公转账在手机上怎么操作
  • 租赁厂房对方不租怎么办
  • 主营业务收入为什么记贷方
  • 合并报表中怎么抵消投资性房地产
  • 验签失败的发票追不回来怎么办
  • 融资租赁是怎么操作的
  • 奖品偶然所得个税如何申报
  • 房屋租赁协议填写版本
  • 别人开业送的花怎么说
  • 新建厂房房产证办理流程
  • 对公账户打钱给私人账户,谁交税呢
  • 咨询服务费怎么结转成本
  • 每月发放奖金的会计分录
  • 顾问费的个税怎么扣
  • 购买方红字信息表开具流程图
  • 个人公益性捐赠全额还是限额
  • 工会筹备金怎么报
  • 退休职工费用哪里列支
  • 福利费开成增值税专用发票怎么办
  • 销售赠送怎么做账
  • 服务行业营业成本占比
  • 支付服务器年租什么意思
  • 包工队人员受伤该由谁负责
  • 万字短文
  • 阐述php的特点
  • code structure
  • php微信公众号开源框架
  • 前端schema
  • which 查找文件
  • 工业企业采购流程
  • 事业单位接受捐赠物资会计处理
  • 教育费附加减免政策
  • db2bigint
  • mongodb $nin
  • 应收账款红冲什么意思
  • 进项税需要转出的分录
  • 不动产作价出资入股登记收件
  • 免税黄金什么意思
  • 收到股东投资款需要交印花税吗
  • 外贸出口企业申报年月怎么填
  • 建筑企业预缴税款怎么算
  • 企业哪些税费不通过应交税费账户进行核算
  • 填制费用报销单怎么填写
  • 集团拨款
  • 小规模如何申报1个点
  • 其他资本公积核算哪些内容
  • 如何建立一个新的群
  • win2003r2企业版密钥
  • 众微科技怎么样
  • linux进程运行的两种方式
  • centos6.7防火墙
  • mac关机快捷键是什么键
  • vi编辑器是干什么的
  • windows xp 7 10
  • mac使用命令行
  • 不能运行应用程序的是
  • linux检查更新
  • win8注销在哪里
  • linux内核文件夹
  • python函数详解
  • jquery插件使用教程
  • shell检查语法错误
  • cd弹出错误怎么回事
  • 批处理改ipv4地址
  • jquery旋转动画
  • python文件操作方法
  • js类的实现
  • js设置rem
  • 面向对象的java语言
  • 美国对中国纺织服装关税
  • 专项扣除赡养老人是什么意思
  • 技术转让条件
  • 河北省十大杰出五四青年
  • 一般纳税人城建税减免最新政策
  • 青岛个人所得税咨询电话是多少
  • 征管法 追征期起如何界定
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设