This repository was archived by the owner on May 29, 2019. It is now read-only.
This repository was archived by the owner on May 29, 2019. It is now read-only.
Problem with carousel after hiding and showing #1513
Description
Hi there,
Whenever I hide the carousel, wait a couple of seconds and show it, the left and right arrows no longer work and the carousel doesn't auto cycle.
For some reason I can't save a plunker but here's the html:
<!doctype html>
<html ng-app="plunker">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.js"></script>
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.9.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="CarouselDemoCtrl">
<input type="checkbox" ng-model="hide">Click to hide
<div ng-hide="hide">
<carousel interval="2000">
<slide ng-repeat="slide in slides" active="slide.active">
<img ng-src="{{slide.url}}" style="margin:auto;">
<div class="carousel-caption">
<p>{{slide.description}}</p>
</div>
</slide>
</carousel>
</div>
</div>
</body>
</html>
And js:
angular.module('plunker', ['ui.bootstrap']);
function CarouselDemoCtrl($scope) {
$scope.slides = [{
url: 'http://i.imgur.com/xKE07.jpg',
description: 'bla'
}, {
url: 'http://wpmedia.blogs.windsorstar.com/2013/01/cat_shot_by_arrow-1.jpg',
description: 'bli'
}];
}