利用Angularjs实现幻灯片效果
前言
Jquery发展至今,幻灯组件已经非常成熟,所以下面小编带大家一起看看利用Angularjs实现幻灯片效果的步骤。
npm方式安装
npminstallangularjsSlider
使用方法
第一步(引入)
require('angularjsSlider')(moduleName);//引入
第二步(参数配置)
第三步(插入标签)
<slider></slider>//插入html标签
<divclass="sliderBox"ng-controller="firstCtrl"> <slidertimer="2"data="data"btn-left="#btnleft"btn-right=".btnright"animate-type="ease"animate-time="1.0"> </slider> <divclass="btnleft"id="btnleft"></div> <divclass="btnrightbtnright"></div> </div>
varmyModule=angular.module('myApp',[]); myModule.controller('firstCtrl',function($scope){ $scope.data=[{img:"../img/1.jpg",link:"#"}]; });
总结
以上就是这篇文章的全部内容,希望这篇文章对大家能有所帮助,如果有疑问大家可以留言交流。