发表于: 2017-02-08 01:26:26
2 1339
完成最新职位,服务流程;伙伴之言模块的轮播指令还待完善,原计划调试首页接口,进度没跟上。
2. 明天的计划:
调试首页接口,完善伙伴之言模块,完成首页。
3. 遇到的困难:
学习ui-bootstrap的轮播插件,1.5版本左右应该就可以用了,无法具体控制轮播的间距,
@media not all, (-webkit-transform-3d)
.carousel-inner > .item.next.left, .carousel-inner > .item.prev.right, .carousel-inner > .item.active {
left: 0;-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
//可以通过更改transform参数的值,变换轮播的方向
//transform: translate3d(0, 100%, 0);
}
.controller('CarouselDemoCtrl', function ($scope) {
$scope.myInterval = 5000; //循环播放间隔
$scope.noWrapSlides = false; //是否允许循环
$scope.active = 0; //当前显示的图片对应的是id
var slides = $scope.slides = []; //显示轮播的数据,用来迭代到html里面
var currIndex = 0;
/* 添加图片 */
$scope.addSlide = function() { //添加数据的函数,可根据数据重写这个函数适应自己的数据结构
var newWidth = 600 + slides.length + 1;slides.push({
//展示轮播的数据对象,内容根据需求添加
image: '//unsplash.it/' + newWidth + '/300',
image2: '//unsplash.it/' + newWidth + '/301',
company: '联想',
job:'WEB研发工程师',
id: currIndex++
});
};
for (var i = 0; i < 4; i++) {
$scope.addSlide();
}
})
<div uib-carousel active="active" interval="myInterval" no-wrap="noWrapSlides">
<div uib-slide ng-repeat="slide in slides track by slide.id" index="slide.id">
//这里面放置轮播展示html,结构可以根据自己的样式重写
<img ng-src="{{slide.image}}" style="margin:auto;">
<div class="carousel-caption">
<h4>Slide {{slide.id}}</h4>
<p>{{slide.text}}</p>
</div></div>
</div>
http://angular-ui.github.io/bootstrap/
4.收获:
今天分享的是js中return的用法,return表示从被调函数返回到主调函数继续执行,返回时可附带一个返回值,由return后面的参数指定,常用在带返回值的函数中,也可以
在循环,判断语句中使用return可以直接跳出,在循环语句中还可以使用continue跳出当前这一次循环。
评论