Skip to content

Commit

Permalink
demo(carousel): center images and increase size to full frame
Browse files Browse the repository at this point in the history
  • Loading branch information
Justin Hall authored and pkozlowski-opensource committed Dec 28, 2013
1 parent 1f632b6 commit c409fdc
Show file tree
Hide file tree
Showing 3 changed files with 14 additions and 12 deletions.
20 changes: 11 additions & 9 deletions src/carousel/docs/demo.html
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
<div ng-controller="CarouselDemoCtrl">
<carousel interval="myInterval">
<slide ng-repeat="slide in slides" active="slide.active">
<img ng-src="{{slide.image}}" style="margin:auto;">
<div class="carousel-caption">
<h4>Slide {{$index}}</h4>
<p>{{slide.text}}</p>
</div>
</slide>
</carousel>
<div style="height: 305px">
<carousel interval="myInterval">
<slide ng-repeat="slide in slides" active="slide.active">
<img ng-src="{{slide.image}}" style="margin:auto;">
<div class="carousel-caption">
<h4>Slide {{$index}}</h4>
<p>{{slide.text}}</p>
</div>
</slide>
</carousel>
</div>
<div class="row">
<div class="col-md-6">
<a class="btn btn-info" ng-click="addSlide()">Add Slide</a>
Expand Down
4 changes: 2 additions & 2 deletions src/carousel/docs/demo.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@ function CarouselDemoCtrl($scope) {
$scope.myInterval = 5000;
var slides = $scope.slides = [];
$scope.addSlide = function() {
var newWidth = 200 + ((slides.length + (25 * slides.length)) % 150);
var newWidth = 600 + slides.length;
slides.push({
image: 'http://placekitten.com/' + newWidth + '/200',
image: 'http://placekitten.com/' + newWidth + '/300',
text: ['More','Extra','Lots of','Surplus'][slides.length % 4] + ' ' +
['Cats', 'Kittys', 'Felines', 'Cutes'][slides.length % 4]
});
Expand Down
2 changes: 1 addition & 1 deletion template/carousel/slide.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,4 @@
'next': (next || active) && direction=='next',
'right': direction=='prev',
'left': direction=='next'
}" class="item" ng-transclude></div>
}" class="item text-center" ng-transclude></div>

0 comments on commit c409fdc

Please sign in to comment.