今日完成：

1：按照官网简单学习了一下factory的用法，将接口和请求分别写在两个factory文件里，在控制器里调用

2：使用ui-bootstrap的轮播图完成了首页banner，但是依然将相关函数放在了控制器里，还是要学习一下如何实现代码的高复用

3：四张小图片轮播没找到angular相关插件，不得已使用jq，将jq的插件封装为一个自定义指令，这个自定义指令很简单，

但是相关的配置参数仿照网上写在了html里，搜了半天如何写在指令里，没找到

遇到的问题：

暂无

明日计划：完成首页的两个小轮播图

今日收获：

ui-bootstrap插件的使用，以及相关参数配置，

jQuery slick插件的使用

使用方法

1、引入文件

<link rel="stylesheet" href="style/slick.css">

<script src="script/jquery.min.js"></script>

<script src="script/slick.min.js"></script>

2、HTML

1

2

3

4

5

6

7

<div class="slick">

    <div><a href="http://www.jq22.com"><img src="images/1.jpg" alt=""></a></div>

    <div><a href="http://www.jq22.com"><img src="images/2.jpg" alt=""></a></div>

    <div><a href="http://www.jq22.com"><img src="images/3.jpg" alt=""></a></div>

    <div><a href="http://www.jq22.com"><img src="images/4.jpg" alt=""></a></div>

    <div><a href="http://www.jq22.com"><img src="images/5.jpg" alt=""></a></div>

</div>

3、JavaScript

1

2

3

4

5

$(function(){

    $('.slick').slick({

        dots: true

    });

});

参数

accessibility 布尔值 true 启用Tab键和箭头键导航

autoplay 布尔值 false 自动播放

autoplaySpeed 整数 3000 自动播放间隔

centerMode 布尔值 false 中心模式

centerPadding 字符串 ’50px’ 中心模式左右内边距

cssEase 字符串 ‘ease’ CSS3 动画

customPaging function n/a 自定义分页

dots 布尔值 false 指示点

draggable 布尔值 true 启用桌面拖动

easing 字符串 ‘linear’ animate() fallback easing

fade 布尔值 false 淡入淡出

arrows 布尔值 true 左右箭头

infinite 布尔值 true 循环播放

lazyLoad 字符串 ‘ondemand’ 延迟加载，可选 ondemand 和 progressive

onBeforeChange(this, index) method null 开始切换前的回调函数

onAfterChange(this, index) method null 切换后的回调函数

onInit(this) method null 第一次初始化后的回调函数

onReInit(this) method null 再次初始化后的回调函数

pauseOnHover 布尔值 true 鼠标悬停暂停自动播放

responsive object null 断点触发设置

slide 字符串 ‘div’ 滑动元素查询

slidesToShow 整数 1 幻灯片每屏显示个数

slidesToScroll 整数 1 幻灯片每次滑动个数

speed 整数 300 滑动时间

swipe 布尔值 true 移动设备滑动事件

touchMove 布尔值 true 触摸滑动

touchThreshold 整数 5 滑动切换阈值，即滑动多少像素后切换

useCSS 布尔值 true 使用 CSS3 过度

vertical 布尔值 false 垂直方向