前端全屏(轮播)滚动插件

全屏滚动

1、fullpage.js

fullPage.js 是一个基于 jQuery 的插件,它能够很方便、很轻松的制作出全屏网站。如今我们经常能见到全屏网站,尤其是国外网站。这些网站用几幅很大的图片或色块做背景,再添加一些简单的内容,显得格外的高端大气上档次。如果你也希望你的网站能设计成全屏的,显得更上档次,你可以试试 fullPage.js

fullPage.js 的主要功能有:支持鼠标滚动、支持前进后退和键盘控制、多个回调函数、支持手机、平板触摸事件、支持 CSS3 动画、支持窗口缩放、窗口缩放时自动调整、可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等

支持 Vue 版本 vue-fullpage.js

2、pagePiling.js

与其他的全屏滚动插件相比,pagePiling.js 的主要特点是滚动方式,它把所有“页面”叠在一起,使用 translate3d “抽”动页面,产生了一种类似“视觉差”的效果。

3、Swiper

在轮播器的基础上,同样支持全屏滚动。

轮播器

1、Swiper

Swiper 是最现代的免费移动触摸幻灯片,具有硬件加速过渡和惊人的本地行为。它旨在用于移动网站,移动Web应用程序和移动本机/混合应用程序。

Swiper 并不兼容所有平台,它是一款只专注于现代应用/平台的现代触摸幻灯片,带来最好的体验和简单的操作。

2、Owl Carousel 2

支持触摸的 jQuery 插件,让你创建一个漂亮的响应式转盘幻灯片。猫头鹰旋转木马已经被数百名开发者选为头号 jQuery 插件。

现在是时候推出新的版本了,它带来了很多新的功能和更多用户友好的API。

3、 Slick Slider

完全响应,随容器缩放,每个断点的单独设置在可用时使用 css3,如果没有,则功能齐全。桌面鼠标拖动无限循环,通过箭头键导航可完全访问添加,删除,过滤和取消过滤幻灯片自动播放,点,箭头,回调等。

4、ItemSlider

有关如何使用 css 动画和 jQuery 创建具有最小设计的简单类别幻灯片的教程,其思想是根据滑动方向顺序地滑动项目。

5、blueimp Gallery

blueimp Gallery 是一个支持触摸的、响应式的、可定制的图片和视频画廊、旋转木马和lightbox,针对移动和桌面网络浏览器进行了优化。

它具有滑动、鼠标和键盘导航、过渡效果、幻灯片功能、全屏支持、按需加载内容等功能,并可扩展以显示更多的内容类型。

  • 0
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

卡尔特斯

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值