jquery+hubslider实现三维3d堆叠式幻灯片效果代码

代码语言:html

所属分类:幻灯片

代码描述:jquery+hubslider实现三维3d堆叠式幻灯片效果代码

代码标签: jquery 堆叠 三维 幻灯片

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

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <style>
        body { background-color:#333;}
    .container {
      width: 500px;
      margin: 350px auto;
    }
    
    .hub-slider { position: relative; }
    
    .hub-slider ul { list-style: none; }
    
    .hub-slider ul li {
      width: 500px;
      height: 300px;
      background: #DA4453;
      color:#fff;
      line-height:300px;
      text-align:center;
      position: absolute;
      border-radius:5px;
      left: 0;
      top: 0;
    }
    
    .hub-slider-controls {
      position: absolute;
      right: 0;
      top: 0;
      z-index: 1000;
    }
    
    .hub-slider-arrow {
      width: 40px;
      height: 40px;
      border: none;
      background: #34BC9D;
      color: #fff;
      font-weight: bold;
    }
    </style>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/hubslider.js"></scri.........完整代码请登录后点击上方下载按钮下载查看

网友评论0