jquery+owl.carousel实现支持手机端的滑块图文轮播效果代码

代码语言:html

所属分类:幻灯片

代码描述:jquery+owl.carousel实现支持手机端的滑块图文轮播效果代码

代码标签: jquery owl 图文 滑块 轮播

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
   
<meta charset="UTF-8">

   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/owl.carousel.min.css">

   
<style>
        .shadow-effect {
                    background: #fff;
                    padding: 20px;
                    border-radius: 4px;
                    text-align: center;
        border:1px solid #ECECEC;
                    box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);
                }
                #customers-testimonials .shadow-effect p {
                    font-family: inherit;
                    font-size: 17px;
                    line-height: 1.5;
                    margin: 0 0 17px 0;
                    font-weight: 300;
                }
                .testimonial-name {
                    margin: -17px auto 0;
                    display: table;
                    width: auto;
                    background: #3190E7;
                    padding: 9px 35px;
                    border-radius: 12px;
                    text-align: center;
                    color: #fff;
                    box-shadow: 0 9px 18px rgba(0,0,0,0.12), 0 5px 7px rgba(0,0,0,0.05);
                }
                #customers-testimonials .item {
                    text-align: center;
                    padding: 50px;
                                margin-bottom:80px;
                    opacity: .2;
                    transform: scale3d(0.8, 0.8, 1);
                    transition: all 0.3s ease-in.........完整代码请登录后点击上方下载按钮下载查看

网友评论0