/*-------------------- 获取地址栏地址并拆分 --------------------------------*/ 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 += ''; 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 += '
    '; $('.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'); } }) })