如图：
点击图片时跳转链接，要求放大图片和底部有缩略图，如图所示：
思路：
1)、在列表页，给每一个数据加上对应的标识位，点跳转时传过去
2)、获取值、获取屏幕宽度
var number = '{{ app.request.get('n') }}';
var window_width = $(document).width();
3)、
获取外层slide-ul的left偏移值
$('.slide-ul').css('left','-' + window_width*number + 'px');
此时就可以定位到列表点击到图片的放大图了
另外还要要求：当点击下面的缩略图时，也要定位到当前的大图(下面的缩略图是可以左右滑动的)
所以：
1)每一个缩略图也应该有一个标识位，遍历缩略图得到每个图片的left值
var w;
$('.slide-li').each(function(){
var $this = $(this);
var key = $this.data('id');
w = key*window_width;
$this.css('left',w);
});
2)、当点击缩略图时给当前加上一个框，给所有的列表去除这个框，和上面思路一样，获取slide-ul的left偏移值
$('.background').on('click',function () {
var $this = $(this);
$('.background').removeClass('thumb-active');
$this.addClass('thumb-active');
var this_id = $this.data('id');
var d_width = window_width*this_id;
$('.slide-ul').css('left','-' + d_width + 'px');
});
转载时请注明出处及相应链接，本文永久地址：/20825.html
微信打赏
支付宝打赏
感谢您对作者Liam的打赏，我们会更加努力！如果您想成为作者，请点我
