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