在其中一列中包含滑块

时间:2016-05-08 06:44:01

标签: jquery html css twitter-bootstrap

how can i add slider in one of the column(i.e. video column). I have amazing slider but i failed to show that in column. I am a beginner and a learner. Your help will be appreciated. Thank You

<div class="container">
    <div class="row text-center">


            <div class="col-md-4 col-sm-7 hero-feature">
                <div class="thumbnail">
                        <img src="images/one.jpg" style="
    height: 200px;
    width: 300px;
">
                    <div class="caption">
                        <h3>Videos</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                        <p>
                            <a href="#" class="btn btn-primary">Buy Now!</a> <a href="#" class="btn btn-default">More Info</a>
                        </p>
                    </div>
                </div>
            </div>

            <div class="col-md-4 col-sm-7 hero-feature">
                <div class="thumbnail">
                   <img src="images/one.jpg" style="
    height: 200px;
    width: 300px;
">
                    <div class="caption">
                        <h3>HSE Resource</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                        <p>
                            <a href="#" class="btn btn-primary">Buy Now!</a> <a href="#" class="btn btn-default">More Info</a>
                        </p>
                    </div>
                </div>
            </div>
            </div>
    </div>

1 个答案:

答案 0 :(得分:0)

正如您在amazingslider的quickstart上看到的,您需要的一切就是首先创建滑块,然后将其实现为HTML。

对于您的示例,您应该执行类似

的操作
<div id="amazinslider1">
  <ul class="amazingslider-slides">
      <li><img src="path/to/image"></li>
  </ul>
</div>

不要忘记在</head>

结束前添加js