html怎么实现左右滑动导航栏


本文摘自PHP中文网,作者V,侵删。

背景:

最近在写一个公众号项目时遇到需要动态生成菜单可滑动,在之前的android开发中实现通过v7包中提供的组件即可完成。那么,在网页的开发中需要如何实现这个功能呢?

(推荐教程:html教程)

可以通过swiper.js来实现可滑动菜单。

以下需引入swiper.css、swiper.js。

html部分:

1

2

3

4

5

6

7

8

9

10

11

<div class="swiper-container">

  <div class="swiper-wrapper">

    <div class="swiper-slide">slider1</div>

    <div class="swiper-slide">slider2</div>

    <div class="swiper-slide">slider3</div>

    <div class="swiper-slide">slider3</div>

    <div class="swiper-slide">slider3</div>

    <div class="swiper-slide">slider3</div>

    <div class="swiper-slide">slider3</div>

  </div>

</div>

js部分:

阅读剩余部分

相关阅读 >>

Html中鼠标停留时整行变色

Html的计算机代码元素有哪些

Html文档中嵌入javascript的四种方法

Html tt标签怎么用

Html实现网页标题栏添加图标

一篇文章让你看懂Html基本规则和网页结构

Html script标签怎么用

Html area标签怎么用

Html实现窗口大小变化时页面刷新(代码)

Html表格的基本属性

更多相关阅读请进入《Html》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...