/*-------------------- 获取地址栏地址并拆分 --------------------------------*/
function getParams(url) {
var theRequest = new Object();
if (!url)
url = location.href;
if (url.indexOf("?") !== -1)
{
var str = url.substr(url.indexOf("?") + 1) + "&";
var strs = str.split("&");
for (var i = 0; i < strs.length - 1; i++)
{
var key = strs[i].substring(0, strs[i].indexOf("="));
var val = strs[i].substring(strs[i].indexOf("=") + 1);
theRequest[key] = val;
}
}
return theRequest;
}
var objUrl = {}; //获取get参数
var url = window.location.href;
var params = getParams(url);
if(!$.isEmptyObject(params)){
$.each(params,function(key,val){
objUrl[key] = val;
})
}
var lpid=$('.lpalbum').attr('data-hid');
var album_id = 0;
var oindex = 0;
var thisLi='';
var urlid=objUrl.daid;
var videoR=$('.showimg_center .y_v3videoBox').attr('url');
var videoImg=$('.showimg_center .y_v3videoBox').attr('data-img');
//进入页面默认加载 相册列表出过来的默认参数 并给添加选中效果
$(function(){
$('.lpalbumBox_rNav a').on('click',function(){
var that = $(this);
album_id =that.attr('album-id');
var typeName=that.attr('type-name')
if (album_id!=0 && typeName!='videourl') {
$('.img_c_cin').html('查看原图')
if (album_id!=objUrl.album_id) {
urlid=0;
};
oindex=0;
$('.showimg_center .y_v3videoBox').hide();
// console.log(album_id)
that.addClass('on').siblings().removeClass('on');
var _html="";
// 初始化变量并赋值
var minindex = 0; // 小图所在的下标
var minlength = 0; // 小图所有的总数
// 以三行 unbind 解除绑定事件,是为了多次点导航时,执行次的原因
$('.lpalbumBox_l .prev-btn').unbind();
$('.lpalbumBox_l .next-btn').unbind();
$('.tulist .tulist_main ul li').unbind();
$('.tulist_main ul').html('');
$.ajax({
url: "/house/housephoto?page=0&type=picture&id="+lpid+'&type_id='+album_id,
type: "get",
dataType: "json",
success: function(data) {
if(data.code == 200){
$.each(data.data, function (key,val) {
_html+='
';
_html+='
';
_html+='';
});
$('.tulist .tulist_main ul').html(_html);
thisLi = $('.tulist_main li'); // 小图选择器
var mySwiper = new Swiper('.tulist_main',{
slidesPerView :'auto',
slideToClickedSlide:true,
autoplayDisableOnInteraction:false,
onInit: function(swiper){
//Swiper初始化了
minlength = swiper.imagesToLoad.length;
ImgShow(swiper.activeIndex);
},
})
// 左切换按钮
$('.lpalbumBox_l .prev-btn').on('click',function(){
(minindex == 0) ? minindex = 0 : minindex--;
ImgShow(minindex)
if(minlength > 5 && minindex <= minlength-1 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*152); //小图滑动,96为图片一次滑动的距离
}
// console.log(minindex)
})
//右切换按钮
$('.lpalbumBox_l .next-btn').on('click',function(){
(minindex == minlength-1) ? minindex = minlength-1 : minindex++;
ImgShow(minindex)
if(minlength > 5 && minindex <= minlength-5 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*152); //小图滑动,96为图片一次滑动的距离
}
})
//小图点击事件
$('body .tulist_main').on('click','li',function(){
var thit = $(this);
minindex = thit.index();
ImgShow(minindex)
})
$('.tulist_main li[data-id="'+urlid+'"]').click();
mySwiper.setWrapperTranslate('-'+urlid*152); //小图滑动,96为图片一次滑动的距离
// 获取图片地址并显示图片
function ImgShow(index){
var URL = thisLi.eq(index).attr('data-url');
$('.list_length em').html((index+1))
$('.showimg_center .img_c em img').attr('src',URL);
$('.showimg_center .img_c').attr('data-index',index);
$('.showimg_center .img_c').attr('data-id',album_id);
$('.showimg_center .img_c').attr('house-id',lpid);
$('.showimg_center .img_c').attr('data-type',typeName);
thisLi.eq(index).addClass('on').siblings().removeClass('on');
}
}
}
});
}else{
that.addClass('on').siblings().removeClass('on');
var _html="";
$('.img_c_cin').html('播放视频');
$('.showimg_center .y_v3videoBox').show();
// 初始化变量并赋值
var minindex = 0; // 小图所在的下标
var minlength = 0; // 小图所有的总数
// 以三行 unbind 解除绑定事件,是为了多次点导航时,执行次的原因
$('.lpalbumBox_l .prev-btn').unbind();
$('.lpalbumBox_l .next-btn').unbind();
$('.tulist .tulist_main ul li').unbind();
$('.tulist_main ul').html('');
_html+='';
_html+='
';
_html+='';
$('.tulist .tulist_main ul').html(_html);
thisLi = $('.tulist_main li'); // 小图选择器
var mySwiper = new Swiper('.tulist_main',{
slidesPerView :'auto',
slideToClickedSlide:true,
autoplayDisableOnInteraction:false,
onInit: function(swiper){
//Swiper初始化了
minlength = swiper.imagesToLoad.length;
ImgShow(swiper.activeIndex);
},
})
// 左切换按钮
$('.lpalbumBox_l .prev-btn').on('click',function(){
(minindex == 0) ? minindex = 0 : minindex--;
ImgShow(minindex)
if(minlength > 5 && minindex <= minlength-1 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*148); //小图滑动,96为图片一次滑动的距离
}
// console.log(minindex)
})
//右切换按钮
$('.lpalbumBox_l .next-btn').on('click',function(){
(minindex == minlength-1) ? minindex = minlength-1 : minindex++;
ImgShow(minindex)
if(minlength > 5 && minindex <= minlength-5 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*148); //小图滑动,96为图片一次滑动的距离
}
})
//小图点击事件
$('body .tulist_main').on('click','li',function(){
var thit = $(this);
minindex = thit.index();
ImgShow(minindex)
})
$('.tulist_main li[data-id="'+urlid+'"]').click();
mySwiper.setWrapperTranslate('-'+urlid*148); //小图滑动,96为图片一次滑动的距离
// 获取图片地址并显示图片
function ImgShow(index){
var URL = thisLi.eq(index).attr('data-url');
$('.list_length em').html((index+1))
$('.showimg_center .img_c em img').attr('src',URL);
$('.showimg_center .img_c').attr('data-index',index);
$('.showimg_center .img_c').attr('data-id',album_id);
$('.showimg_center .img_c').attr('house-id',lpid);
$('.showimg_center .img_c').attr('data-type',typeName);
thisLi.eq(index).addClass('on').siblings().removeClass('on');
}
}
})
if (objUrl.album_id!=0) {
$('.lpalbumBox_rNav a[album-id="'+objUrl.album_id+'"]').click();
}else{
$('.lpalbumBox_rNav a').eq(0).click();
}
var randomX = 100;
var randomY = 243;
var randvalue = parseInt(Math.random() * (randomX - randomY + 1) + randomY);
$('.bin_f_text p.kt span').html(randvalue);
})
$(function(){
/*----------------------------------图片放大特效浏览--------------------------------------------*/
// 关闭按钮
$('.weffects-cls').on('click',function(){
$('.weffects').hide();
})
// 大图触发
var oindex = 0;
$('body').on('click','.wwlargeimg',function(){
$('.weffects').show();
var that = $(this);
var otype = that.attr('data-id');
var oid = that.attr('house-id');
var oty = that.attr('data-type');
var nav = '';
oindex = 0;
if(that.attr('data-index') != undefined && that.attr('data-index') != 'undefined'){
oindex = that.attr('data-index');
}
if (oty=='picture') {
$.ajax({
type: "post",
url: '/public/gethouseablum',
data: {type:oty,id:oid,type_id:otype},
dataType: "json",
success: function(data){
if(data.code == 200){
// 遍历导航
if ($('body .y_v3videoBox').length>0) {
nav +='视频(1)'
}
$.each(data.data.nav,function(k,v){
nav += ''+v.name+'';
})
$('.weffects-list-nav').html('');
$('.weffects-list-nav').append(nav);
}
$('.weffects-list-nav a[data-id="'+otype+'"]').click();
}
});
}else if(oty=='videoUrl'){
$.ajax({
type: "post",
url: '/public/gethouseablum',
data: {type:'picture',id:oid,type_id:otype},
dataType: "json",
success: function(data){
if(data.code == 200){
// 遍历导航
if ($('body .y_v3videoBox').length>0) {
nav +='视频(1)'
};
$.each(data.data.nav,function(k,v){
nav += ''+v.name+'';
})
$('.weffects-list-nav').html('');
$('.weffects-list-nav').append(nav);
}
$('.weffects-list-nav a[data-id="'+otype+'"]').click();
}
});
}
})
// 放大导航点击
$('.weffects-list-nav').on('click','a',function(){
oindex = 0;
var that = $(this);
var otype = that.attr('data-id');
var oid = that.attr('house-id');
var oty = that.attr('data-type');
var li = '';
var v_html='';
// 初始化变量并赋值
var minindex = 0; // 小图所在的下标
var minlength = 0; // 小图所有的总数
that.addClass('on').siblings().removeClass('on');
if (oty=='picture') {
// 以三行 unbind 解除绑定事件,是为了多次点导航时,执行次的原因
$('.weffects .prev-btn').unbind();
$('.weffects .next-btn').unbind();
$('.weffects-list-imgbox li').unbind();
$.ajax({
type: "post",
url: '/public/gethouseablum',//'/js/home.json',
data: {type:oty,id:oid,type_id:otype},
dataType: "json",
success: function(data){
if(data.code == 200){
// 遍历导航
li += '';
li += '
';
$.each(data.data.imgarr,function(k,v){
li += '
';
})
li += '
';
li+='
';
li+='
';
li += '
';
$('.weffects-list-imgbox').html('');
$('.weffects-list-imgbox').append(li);
}
var thisLi = $('.weffects-list-imgbox li'); // 小图选择器
var mySwiper = new Swiper('.weffects-list-img',{
slidesPerView :'auto',
spaceBetween : 8,
slideToClickedSlide:true,
autoplayDisableOnInteraction:false,
prevButton:'.swiper-button-prev',
nextButton:'.swiper-button-next',
onInit: function(swiper){
//Swiper初始化了
minlength = swiper.imagesToLoad.length;
ImgShow(swiper.activeIndex);
// console.log(minlength)
},
})
$('.weffects .prev-btn,.weffects .next-btn').show();
// 左切换按钮
$('.weffects .prev-btn').on('click',function(){
(minindex == 0) ? minindex = 0 : minindex--;
ImgShow(minindex)
if(minlength > 7 && minindex <= minlength % 7 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*156); //小图滑动,96为图片一次滑动的距离
}
// console.log(minindex)
})
//右切换按钮
$('.weffects .next-btn').on('click',function(){
(minindex == minlength-1) ? minindex = minlength-1 : minindex++;
ImgShow(minindex)
if(minlength > 7 && minindex <= minlength-7 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*156); //小图滑动,96为图片一次滑动的距离
}
// console.log(minindex)
})
//小图点击事件
$('.weffects-list-imgbox li').on('click',function(){
var thit = $(this);
minindex = thit.index();
ImgShow(minindex)
// console.log(minindex)
})
$('.weffects-list-imgbox li').eq(oindex).click();
// 获取图片地址并显示图片
function ImgShow(index){
$('.magnify-box').html('');
var URL = thisLi.eq(index).attr('data-url');
// $('.magnify-box img').attr('src',URL);
$('.magnify-box').html('
');
thisLi.eq(index).addClass('in').siblings().removeClass('in');
}
}
});
}else if(oty=='videoUrl'){
// 遍历导航
li += '';
li += '
';
li += '
';
li += '
';
li+='
';
li+='
';
li += '
';
$('.weffects-list-imgbox').html('');
$('.weffects-list-imgbox').html(li);
var thisLi = $('.weffects-list-imgbox li'); // 小图选择器
var mySwiper = new Swiper('.weffects-list-img',{
slidesPerView :'auto',
spaceBetween : 8,
slideToClickedSlide:true,
autoplayDisableOnInteraction:false,
prevButton:'.swiper-button-prev',
nextButton:'.swiper-button-next',
onInit: function(swiper){
//Swiper初始化了
minlength = swiper.imagesToLoad.length;
ImgShow(swiper.activeIndex);
// console.log(minlength)
},
})
$('.weffects .prev-btn,.weffects .next-btn').hide();
// 左切换按钮
$('.weffects .prev-btn').on('click',function(){
(minindex == 0) ? minindex = 0 : minindex--;
ImgShow(minindex)
if(minlength > 7 && minindex <= minlength % 7 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*156); //小图滑动,96为图片一次滑动的距离
}
// console.log(minindex)
})
//右切换按钮
$('.weffects .next-btn').on('click',function(){
(minindex == minlength-1) ? minindex = minlength-1 : minindex++;
ImgShow(minindex)
if(minlength > 7 && minindex <= minlength-7 ){ //其中 12 为小图一排能显示12张图
mySwiper.setWrapperTransition(800); //设定过渡的时间
mySwiper.setWrapperTranslate('-'+minindex*156); //小图滑动,96为图片一次滑动的距离
}
// console.log(minindex)
})
//小图点击事件
$('.weffects-list-imgbox li').on('click',function(){
var thit = $(this);
minindex = thit.index();
ImgShow(minindex)
})
// $('.weffects-list-imgbox li').eq(oindex).click();
// 获取图片地址并显示图片
function ImgShow(index){
$('.magnify-box').html('');
var URL = thisLi.eq(index).attr('data-url');
thisLi.eq(index).addClass('in').siblings().removeClass('in');
v_html+='';
v_html+='

';
v_html+='

';
v_html+='
';
v_html+='
';
$('.magnify-box').html(v_html);
}
}
})
/*----------------------------------图片放大特效浏览end--------------------------------------------*/
$('body').on('click','.vidplay',function(){
if ($(this).find('video').hasClass('pause')) {
$(this).find('p').hide();
$(this).find('i').hide();
$(this).find('video').trigger("play");
$(this).find('video').removeClass('pause');
$(this).find('video').addClass('play');
} else {
$(this).find('video').trigger("pause");
$(this).find('video').removeClass('play');
$(this).find('video').addClass('pause');
}
})
})