*页 >> 问答

企业网站中的横向滚动的实现

发布于：2023-05-29 16:28:46

在做企业网站的时候，经常能碰到这样的情况：在某个区域显示供应商或者是合作伙伴的图标，以显示公司的可靠性。

滚动显示合作伙伴

效果如上图显示，两边的黄线是为了突出显示，实际应用中请自己设置。

如何实现的呢？

1、自己写jquery或者javascript实现，当然可以。不建议这样做（大神除外），当然如果发生兼容性问题的时候，不得不自己写。

2、使用现成的插件实现，好多；今天我们就用一款国外比较流行的插件：owl.carousel.min.js来实现。

下面是具体的步骤：

*先：HTML代码：

⑴，依次引入jquery库和owl.carousel.min.js插件；见下图：

引入jquery库和owl.carousel.min.js

⑵依次引入owl.carousel.min.css和支持的皮肤css

引入owl.carousel.min.css

⑶书写结构：

html结构

⑷书写owl.carousel.min.js参数，如下图：

书写参数

⑸书写css文件，注意，这是包裹的容器，而不是插件本身的css，如果需要修改插件本身的css，请修改owl.carousel.css。见下图：

css样式

这样，就搞定了，如第一张动图的效果，如果自己定制一些样式，和滚动选项就需要花一点时间来研究了。

号外，如果需要详细的参数说明，请在评论区留言，我会再写一篇文章来说明的。


免责声明：本站所有内容及图片均采集来源于网络，并无商业使用，如若侵权请联系删除。

上一篇：教你快速撸进网站后台

下一篇：企业网站模板_免费企业网站模板

资讯 观察行业视觉，用专业的角度，讲出你们的心声。
MORE

I NEED TO BUILD WEBSITE

我需要建站

*请认真填写需求信息，我们会在24小时内与您取得联系。