angularjs - Angular js Images slider example -
<body ng-app="myapp"> <div ng-controller="slideshowcontroller" class="imageslide" ng-switch='slideshow' ng-animate="'animate'"> <div class="slider-content" ng-switch-when="1"> <img src="../images/ship.png" /> </div> <div class="slider-content" ng-switch-when="2"> <img src="../images/cargo.png" /> </div> <div class="slider-content" ng-switch-when="3"> <img src="../images/lake.png" /> </div> <div class="slider-content" ng-switch-when="4"> <img src="../images/cargo2.png" /> </div> </div> <script> var app = angular.module('myapp', ['angular-responsive']); app.controller('slideshowcontroller', function($scope, $timeout) { //function slideshowcontroller($scope, $timeout) { var slidesinslideshow = 4; var slidestimeintervalinms = 3000; $scope.slideshow = 1; var slidetimer = $timeout(function interval() { $scope.slideshow = ($scope.slideshow % slidesinslideshow) + 1; slidetimer = $timeout(interval, slidestimeintervalinms); }, slidestimeintervalinms); }); </script> </body>
<script src="../bower_components/angular/angular.min.js"></script> <script src="../bower_components/angular-responsive/src/responsive-directive.js"></script> <script src="../bower_components/script.js"></script> <link rel="stylesheet" href="../bower_components/style2.css" /> <link href="../bower_components/style3.css" rel='stylesheet' type='text/css'>
i need images slider plugin in angular js. must work both desktop , mobile. can please send 1 example image slider angular js.
this code using. here slide function working. no responsive. mobile view working.
you can this library. it's angular carousel, swipable (for mobile) can used regular navigation desktop.
Comments
Post a Comment