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

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

全屏滚动

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,针对移动和桌面网络浏览器进行了优化。

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

相关文章
|
1月前
|
前端开发 数据可视化 数据挖掘
前端开发者的福音:这些插件让你轻松应对各种复杂需求!
前端开发领域充满创意与挑战,面对复杂需求,开发者常感力不从心。本文通过三个真实案例,介绍如何利用Chart.js、ESLint和Ant Design等强大插件,解决数据可视化、代码质量和UI组件复用等问题,提高开发效率,创造更出色的前端作品。
26 3
|
2月前
|
前端开发 JavaScript
乾坤qiankun(微前端)样式隔离解决方案--使用插件替换前缀
乾坤qiankun(微前端)样式隔离解决方案--使用插件替换前缀
495 8
|
2月前
|
存储 前端开发 Java
验证码案例 —— Kaptcha 插件介绍 后端生成验证码,前端展示并进行session验证(带完整前后端源码)
本文介绍了使用Kaptcha插件在SpringBoot项目中实现验证码的生成和验证,包括后端生成验证码、前端展示以及通过session进行验证码校验的完整前后端代码和配置过程。
290 0
验证码案例 —— Kaptcha 插件介绍 后端生成验证码,前端展示并进行session验证(带完整前后端源码)
|
2月前
|
资源调度 前端开发 安全
前端实战:基于Verdaccio搭建私有npm仓库,轻松上传与下载自定义npm插件包
前端实战:基于Verdaccio搭建私有npm仓库,轻松上传与下载自定义npm插件包
133 0
|
3月前
|
运维 前端开发
前端使用antdesign导出插件跨域问题
前端使用antdesign导出插件跨域问题
46 1
|
4月前
|
前端开发 安全 测试技术
[译]一种基于模块联邦的插件前端
[译]一种基于模块联邦的插件前端
|
4月前
|
前端开发 开发者
在前端开发中,webpack 作为模块打包工具,其 DefinePlugin 插件可在编译时动态定义全局变量,支持环境变量定义、配置参数动态化及条件编译等功能。
在前端开发中,webpack 作为模块打包工具,其 DefinePlugin 插件可在编译时动态定义全局变量,支持环境变量定义、配置参数动态化及条件编译等功能。本文阐述 DefinePlugin 的原理、用法及案例,包括安装配置、具体示例(如动态加载资源、配置接口地址)和注意事项,帮助开发者更好地利用此插件优化项目。
130 0
|
5月前
|
前端开发 JavaScript API
只会用插件可不行,这些前端动画技术同样值得收藏-JavaScript篇(下)
只会用插件可不行,这些前端动画技术同样值得收藏-JavaScript篇(下)
58 0
|
5月前
|
监控 JavaScript 前端开发
只会用插件可不行,这些前端动画技术同样值得收藏-JavaScript篇(上)
只会用插件可不行,这些前端动画技术同样值得收藏-JavaScript篇(上)
58 0
|
5月前
|
前端开发 JavaScript UED
只会用插件可不行,这些前端动画技术同样值得收藏-CSS篇
只会用插件可不行,这些前端动画技术同样值得收藏-CSS篇
107 0