适合在企业网站展示企业发展历程的时间轴滑动特效源码
大家好,今天给大家介绍一款,JavaScript实现的适合在企业网站展示企业发展历程的滑动特效源码(图1)。送给大家哦,获取方式在本文末尾。
图1
可以用鼠标左右滑动查看,也可以点击左右按钮查看(图2)
图2
源码完整,需要的朋友可以下载学习(图3)
图3
本源码编码:10141,需要的朋友,关注文末公众号,搜索10141,即可获取。
部分代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>公司发展历程特效</title><link rel="stylesheet" type="text/css" href="static/css/style.css">
<link rel="stylesheet" type="text/css" href="static/css/swiper.min.css">
<link rel="stylesheet" type="text/css" href="static/css/iconfont.css"></head>
<body><div class="about-main2" style="background-image: url(static/image/lc_bg.jpg);"><div class="licheng-bg"><img src="static/picture/lc-quxian.png" class="quxian"><div class="warper pr"><div class="ny-title"><h3 class="title-en">DEVELOPMENT</h3><h4 class="title-ch">发展历程</h4><i></i></div><div class="licheng-content swiper-container"><div class="swiper-wrapper"><div class="swiper-slide"><ul class="clearfix"><li class="item1"><a class="clearfix"><div class="lc-left"><i class="line"></i> <span class="date">1995</span></div><div class="lc-right"><div class="right-text"><h3>公司成立</h3><p>1995年12月14日,某某某有限公司成立。</p></div></div></a></li><li class="item2"><a class="clearfix"><div class="lc-left"><span class="date">2011</span><i class="line"></i> </div><div class="lc-right"><div class="right-text"><h3>公司更名</h3><p>根据许可《关于核准某某某有限公司变更注册资本和股权的批复》,公司注册资本增加至2亿元,由上海某某某有限公司控股,公司名称变更为某某某有限公司。</p></div></div></a></li><li class="item3"><a class="clearfix"><div class="lc-left"><i class="line"></i> <span class="date">2013</span></div><div class="lc-right"><div class="right-text"><h3>获得投资咨询业务资格</h3><p>根据吉林某某某,公司获得投资咨询业务资格。</p></div></div></a></li><li class="item4"><a class="clearfix"><div class="lc-left"><span class="date">2014</span><i class="line"></i> </div><div class="lc-right"><div class="right-text"><h3>公司增资,迁址,获得资管资格</h3><p>根据文件某某某,公司迁址上海市;注册资本增加至6亿元人民币;取得某某某管理业务资格</p></div></div></a></li><li class="item5"><a class="clearfix"><div class="lc-left"><i class="line"></i> <span class="date">2015</span></div><div class="lc-right"><div class="right-text"><h3>子公司成立</h3><p>2015年1月15日,成立风险管理子公司某某某有限公司;2105年10月30日,成立上海某某某有限公司。</p></div></div></a></li></ul></div><div class="swiper-slide"><ul class="clearfix"><li class="item1"><a class="clearfix"><div class="lc-left"><i class="line"></i> <span class="date">2017</span></div><div class="lc-right"><div class="right-text"><h3>成为中国某某某交易中心会员</h3><p>2017年5月,公司成为上海某某某中心首批会员</p></div></div></a></li><li class="item2"><a class="clearfix"><div class="lc-left"><span class="date" style="text-align: center">2019.05.16</span><i class="line"></i> </div><div class="lc-right"><div class="right-text"><h3>公司更名</h3><p>根据许可《关于核准某某某有限公司变更注册资本和股权的批复》,公司注册资本增加至2亿元,由上海某某某有限公司控股,公司名称变更为某某某有限公司。</p></div></div></a></li></ul></div></div><!--按钮--><div class="lc-swiper-btn"><a class="btn-prev fl"><i class="iconfont"></i></a><a class="btn-next fr"><i class="iconfont"></i></a></div></div></div></div>
</div>
<script src="static/js/jquery-1.10.2.js"></script>
<script src="static/js/swiper.min.js" type="text/javascript" ></script>
<script type="text/javascript">var mySwiper = new Swiper('.swiper-container.licheng-content', {autoplay: false, //自动滑动})$('.btn-prev').click(function() {mySwiper.swipePrev();})$('.btn-next').click(function() {mySwiper.swipeNext();})
</script><a href="https://smalltool.github.io/" style="display:none;"></a>
</body>
</html>
本源码编码:10141,需要的朋友,关注文末公众号,搜索10141,即可获取。
适合在企业网站展示企业发展历程的时间轴滑动特效源码相关推荐
- php企业网站带模块,DouPHP模块化企业网站管理v1.6系统含小程序/公众号源码
DouPHP是一款轻量级企业网站管理系统,基于PHP+MYSQL架构的, 包含"手机版"."公众号管理模块"."小程序",可以使用它快速搭建 ...
- 企业网站+Axure企业官网通用模板+公司官网通用模板+web端高保真原型+门户官网+物流企业+门户网站+服务中心+产品中心+新闻中心+帮助中心+企业官网+公司官网+公司网站+登录注册+高保真交互
企业网站+Axure企业官网通用模板+公司官网通用模板+web端高保真原型+门户官网+物流企业+门户网站+服务中心+产品中心+新闻中心+帮助中心+企业官网+公司官网+公司网站+Axure原型+rp原型 ...
- 计算机毕业设计ssm企业会议室预约系统的设计与实现3j969系统+程序+源码+lw+远程部署
计算机毕业设计ssm企业会议室预约系统的设计与实现3j969系统+程序+源码+lw+远程部署 计算机毕业设计ssm企业会议室预约系统的设计与实现3j969系统+程序+源码+lw+远程部署 本源码技术栈 ...
- javaHTML5寿光农产品资源展示平台计算机毕业设计MyBatis+系统+LW文档+源码+调试部署
javaHTML5寿光农产品资源展示平台计算机毕业设计MyBatis+系统+LW文档+源码+调试部署 javaHTML5寿光农产品资源展示平台计算机毕业设计MyBatis+系统+LW文档+源码+调试部 ...
- 发展简史jQuery时间轴特效
发展简史jQuery时间轴特效.这是一款鼠标滚动到一定的高度动画显示企业发展时间轴特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class="w ...
- 电子处方技术的发展与应用:智慧药店系统源码的核心组成
本文将深入探讨电子处方技术在智慧药店系统中的发展与应用,并着重介绍智慧药店系统源码的核心组成.电子处方技术作为医疗信息化的重要组成部分,通过数字化和网络化手段,实现了处方的电子化,为药店业务的管理和客 ...
- C#毕业设计——基于C#+asp.net+SQL server的教学网站及网上考试系统设计与实现(毕业论文+程序源码)——教学网站及网上考试系统
基于C#+asp.net+SQL server的教学网站及网上考试系统设计与实现(毕业论文+程序源码) 大家好,今天给大家介绍基于C#+asp.net+SQL server的教学网站及网上考试系统设计 ...
- html实现视频网站,仿爱奇艺,搜狐,迅雷看看(附源码)
文章目录 1.功能模板 1.1 仿爱奇艺 1.2 仿搜狐视频 1.3 仿迅雷看看 1.4 视频播放 1.5 影视公司官网 2.效果和源码 2.1 源代码 2.2 模板目录 源码下载 作者:xcLeig ...
- 【web前端特效源码】使用HTML5+CSS3+JavaScript制作一个扁平化风格css螃蟹图形~~适合初学者~超简单~ |前端开发|IT软件
b站视频演示效果: [web前端特效源码]使用HTML5+CSS3+JavaScript制作一个扁平化风格css螃蟹图形~~适合初学者~超简单~ |前端开发|IT软件 效果图: 完整代码: <! ...
- 【web前端特效源码】使用HTML5+CSS3+JavaScript制作一个复古手机键盘(带声音)的动画效果~~适合初学者~超简单~
b站视频演示效果: [web前端特效源码]使用HTML5+CSS3制作一个复古手机键盘(带声音)的动画效果~~适合初学者~超简单~ |前端开发|IT软件 效果图: 完整代码: <!DOCTYPE ...
最新文章
- CDH6.3.2默认管理端口是7180,HDFS相关端口
- EasyDSS高性能RTMP、HLS(m3u8)、HTTP-FLV、RTSP流媒体服务器出现no compatible source was found for this media问题的解决...
- 润乾ajax,通过异步请求实现报表组功能
- spring mvc重定向_Spring的Web MVC –重定向到内存泄漏
- QQ浏览器如何开启夜间模式 夜间模式使用技巧分享
- 2022年中国折叠屏手机市场洞察报告
- 基于visual Studio2013解决面试题之0210树的最远距离
- Unix/Linux 中的 shell 机制
- C#按指定长度分割字符串
- DBMS_ERRLOG记录DML错误日志(一)
- UVA 254 Towers of Hanoi
- Kruscal算法---最小生成树
- 【Ubuntu】Linux系统安装谷歌浏览器简易教程
- textbox提示文字属性_《我来自江湖》MUD类武侠题材多样性玩法的单机文字游戏...
- Unity 将3D物体的世界坐标转换为对应的屏幕坐标
- 通过Python获取维基百科中概念词条的维基信息
- C语言编程 - 推箱子小游戏源码分享 (含过关)
- 两数互素有什么性质_两个数互质是什么意思 判断互质数的方法有哪些
- 机器学习03:人工神经网络
- SpringSecurityOauth中token(Basic、Bearer)