How to create text in panel and make them slide

Manideepgoud
Posted by Manideepgoud under Bootstrap category on | Points: 40 | Views : 907
We have created sliding a text in panel. by creating panel header, body, footer. by carousel-slide
<h3>Sliding Text in panel</h3>
<div class="col-xs-6">
<div class="panel-default" id="tec">
<div class="panel-heading" style="background-color:green;">
<a href="#dnf" style="color:white;" data-toggle="collapse">Sliding Text in panel</a>
<button type="button" class="close" data-dismiss="alert" href="#tec">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div id="dnf" class="collapse panel-collapse active in">
<div class="panel-body">
<div class="thumbnail">
<div id="DemoCarousel" class="carousel slide" data-interval="2000" data-ride="carousel">

<ol class="carousel-indicators">
<li data-target="#DemoCarousel" data-slide-to="0" class="active"></li>
<li data-target="#DemoCarousel" data-slide-to="1"></li>
<li data-target="#DemoCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<h2>Slide 1</h2>
</div>
<div class="item">
<h2>Slide 2</h2>
</div>
<div class="item">
<h2>Slide 3</h2>
</div>
</div>
<a class="carousel-control left" href="#DemoCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="carousel-control right" href="#DemoCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>

</div>
<div style="background-color:pink;" class="panel-footer">
Sliding
</div>
</div>
</div>
</div>

Comments or Responses

Posted by: Amatya on: 12/9/2016 Level:Silver | Status: [Member] | Points: 10
Keep it up

Login to post response