打开主菜单
少前百科GFwiki
β
搜索
查看“Widget:DollPage/Pic”的源代码
←
Widget:DollPage/Pic
因为以下原因,您没有权限编辑本页:
您所请求的操作仅限于该用户组的用户使用:
自动确认用户
您没有权限编辑
Widget
名字空间内的页面。
您可以查看与复制此页面的源代码。
<includeonly><div id="dollPicContain"></div><script type="text/javascript">(window.RLQ=window.RLQ||[]).push(function(){ if(location.hash.indexOf("MOD")>-1){var posit=1}else{var posit=0} var firstload = false; var dollvoice = "<!--{$dollvoice}-->" var dollname = "[ <!--{$dollname}--> ]"; var pic_data = []; <!--{if ($pic1)}-->pic_data.push({name:"<!--{$pic1name}-->", line:"<!--{$line1}-->", pic:"<!--{$pic1}-->", pic_d:"<!--{$pic1d}-->", anime:"<!--{$pic1a}-->", pic_h:"<!--{$pic1h}-->", pic_d_h:"<!--{$pic1dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic2)}-->pic_data.push({name:"<!--{$pic2name}-->", line:"<!--{$line2}-->", pic:"<!--{$pic2}-->", pic_d:"<!--{$pic2d}-->", anime:"<!--{$pic2a}-->", pic_h:"<!--{$pic2h}-->", pic_d_h:"<!--{$pic2dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic3)}-->pic_data.push({name:"<!--{$pic3name}-->", line:"<!--{$line3}-->", pic:"<!--{$pic3}-->", pic_d:"<!--{$pic3d}-->", anime:"<!--{$pic3a}-->", pic_h:"<!--{$pic3h}-->", pic_d_h:"<!--{$pic3dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic4)}-->pic_data.push({name:"<!--{$pic4name}-->", line:"<!--{$line4}-->", pic:"<!--{$pic4}-->", pic_d:"<!--{$pic4d}-->", anime:"<!--{$pic4a}-->", pic_h:"<!--{$pic4h}-->", pic_d_h:"<!--{$pic4dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic5)}-->pic_data.push({name:"<!--{$pic5name}-->", line:"<!--{$line5}-->", pic:"<!--{$pic5}-->", pic_d:"<!--{$pic5d}-->", anime:"<!--{$pic5a}-->", pic_h:"<!--{$pic5h}-->", pic_d_h:"<!--{$pic5dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic6)}-->pic_data.push({name:"<!--{$pic6name}-->", line:"<!--{$line6}-->", pic:"<!--{$pic6}-->", pic_d:"<!--{$pic6d}-->", anime:"<!--{$pic6a}-->", pic_h:"<!--{$pic6h}-->", pic_d_h:"<!--{$pic6dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic7)}-->pic_data.push({name:"<!--{$pic7name}-->", line:"<!--{$line7}-->", pic:"<!--{$pic7}-->", pic_d:"<!--{$pic7d}-->", anime:"<!--{$pic7a}-->", pic_h:"<!--{$pic7h}-->", pic_d_h:"<!--{$pic7dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic8)}-->pic_data.push({name:"<!--{$pic8name}-->", line:"<!--{$line8}-->", pic:"<!--{$pic8}-->", pic_d:"<!--{$pic8d}-->", anime:"<!--{$pic8a}-->", pic_h:"<!--{$pic8h}-->", pic_d_h:"<!--{$pic8dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic9)}-->pic_data.push({name:"<!--{$pic9name}-->", line:"<!--{$line9}-->", pic:"<!--{$pic9}-->", pic_d:"<!--{$pic9d}-->", anime:"<!--{$pic9a}-->", pic_h:"<!--{$pic9h}-->", pic_d_h:"<!--{$pic9dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic10)}-->pic_data.push({name:"<!--{$pic10name}-->", line:"<!--{$line10}-->", pic:"<!--{$pic10}-->", pic_d:"<!--{$pic10d}-->", anime:"<!--{$pic10a}-->", pic_h:"<!--{$pic10h}-->", pic_d_h:"<!--{$pic10dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic11)}-->pic_data.push({name:"<!--{$pic11name}-->", line:"<!--{$line11}-->", pic:"<!--{$pic11}-->", pic_d:"<!--{$pic11d}-->", anime:"<!--{$pic11a}-->", pic_h:"<!--{$pic11h}-->", pic_d_h:"<!--{$pic11dh}-->"});<!--{else}--><!--{/if}--> <!--{if ($pic12)}-->pic_data.push({name:"<!--{$pic12name}-->", line:"<!--{$line12}-->", pic:"<!--{$pic12}-->", pic_d:"<!--{$pic12d}-->", anime:"<!--{$pic12a}-->", pic_h:"<!--{$pic12h}-->", pic_d_h:"<!--{$pic12dh}-->"});<!--{else}--><!--{/if}--> var homepic = [ {name: "图鉴背景", pic: "/images/d/da/DollCampbg.png"}, {name: "默认背景", pic: "/images/3/36/BGDefult_stretch.png"}, {name: "临时作战室", pic: "/images/c/c5/Cg1_stretch.png"}, {name: "荒街涂鸦", pic: "/images/d/d8/Cg3_stretch.png"}, {name: "旧日都市", pic: "/images/2/23/Cg4_stretch.png"}, {name: "平安夜一角", pic: "/images/7/70/Cg_christmas_bed_stretch.png"}, {name: "平安夜小屋", pic: "/images/5/55/Cg_christmas_room_stretch.png"}, {name: "春节酒吧", pic: "/images/c/c8/Cg_2018newyear_stretch.png"}, {name: "教堂", pic: "/images/4/4b/Cg_2018wedding_stretch.png"}, {name: "温馨咖啡厅", pic: "/images/3/30/Cg_2018jxnpr_stretch.png"}, {name: "花火之夏", pic: "/images/d/d2/Cg_fireworks_2018_stretch.png"}, {name: "盛夏海滩", pic: "/images/c/c8/Cg_2018beach_sea_stretch.png"}, {name: "月圆人长久", pic: "/images/0/05/Cg_2018Autumn_moon_stretch.png"}, {name: "幸存者的万圣节", pic: "/images/d/d5/Cg_halloween2018_stretch.png"}, {name: "冬幕将至", pic: "/images/b/b4/Cg_Xmas18_stretch.png"}, {name: "逢魔之刻", pic: "/images/2/25/Cg_2019_redmoon_stretch.png"}, {name: "幻梦花海", pic: "/images/e/e1/Cg_2019summer_stretch.png"}, {name: "闲庭雪情", pic: "/images/6/62/Cg_2020zy_stretch.png"}, {name: "落暮之城", pic: "/images/5/56/Cg_2020WhiteV_stretch.png"}, {name: "夕晖湖畔", pic: "/images/b/b2/Cg_Gunslinger_A_stretch.png"}, {name: "星夜之庭", pic: "/images/d/d1/Cg_Gunslinger_B_stretch.png"}, {name: "昼光之庭", pic: "/images/f/f3/Cg_Gunslinger_C_stretch.png"}, {name: "芙洛拉花径", pic: "/images/c/c0/Cg_Summer2020_stretch.png"}, {name: "藏身处", pic: "/images/5/5e/Cg_Division_Foundation_stretch.png"}, {name: "迷幻梦境", pic: "/images/9/9f/Cg_Winter2021_DreamLand_stretch.png"}, {name: "风吟", pic: "/images/4/48/Cg_Winter2021_Blowing_stretch.png"}, {name: "午后静室", pic: "/images/b/b6/Cg_Winter2021_QuietRoom_stretch.png"}, {name: "鹫羽大厅", pic: "/images/d/db/Cg_Winter2021_Hall_stretch.png"}, {name: "月下庆宴", pic: "/images/2/2c/Cg_2021Anniversary_kr_stretch.png"} ]; // drag and scale and other operations var initial_scale = ($("#dollPicContain").width() < $("#dollPicContain").height()) ? (1.5 * $("#dollPicContain").width() / $("#dollPicContain").height()) : 1.5; var initial_x = ($("#dollPicContain").width() - $("#dollPicContain").height() * initial_scale) / 2; var initial_y = (initial_scale > 1) ? 0 : ($("#dollPicContain").height() * (1 - initial_scale) / 2); const initial_para = {x: initial_x, y: initial_y, scale: initial_scale} var pic_position_before = {x: 0, y: 0}; var pic_position_after = {x: 0, y: 0}; var pic_position_change = {x: 0, y: 0}; var pic_move = {x: initial_para.x, y: initial_para.y}; var pic_on_dragging = false; var pic_scale = initial_para.scale; creat_doll_div(); function stop() {return false;} document.getElementById("#dollPicContain").oncontextmenu = stop; function load_pics(){ for(i in pic_data){ var img = new Image(); $(img).attr({"src": pic_data[i]["pic"]}); var img_2 = new Image(); $(img_2).attr({"src": pic_data[i]["pic_d"]}); var img_3 = new Image(); $(img_3).attr({"src": pic_data[i]["pic_h"]}); var img_4 = new Image(); $(img_4).attr({"src": pic_data[i]["pic_d_h"]}); } } function creat_doll_div(){ let html_text = ` <div id="dollPicDiv"> <div id="dollPicBg"><\/div> <img id="dollPicImg" src=${pic_data[posit]["pic"]} \/> <div id="dollControlBtn"> <div id="dollDragBtn" class="dollPicBtn" state="off"><\/div> <div id="dollPicPositionRe" class="dollPicBtn"><\/div> <div id="dollPicDownload" class="dollPicBtn"> <a target="_blank" href=${pic_data[0]["pic"]} \/> <\/div> <div id="dollPicExpand" class="dollPicBtn" state="off"><\/div> <\/div> <div id="dollLineDiv"> <div id="dollLineName">${dollname}<\/div>${(dollvoice.length > 5) ? `<div id="dollLineVoice">[ ▶ ]<\/div>` : ``}<div id="dollLineWord">${pic_data[0]["line"]}<\/div> <\/div> <\/div>`; $("#dollPicContain").append(html_text); pic_position_reset(0); // switch skins need this button let skin_btn_text = `<div id="dollSkinBtnDiv">`; for(i in pic_data){ if(i == posit) skin_btn_text += `<div class="dollSkinBtn skinChosen" index="${i}" >${pic_data[i]["name"]}`; else skin_btn_text += `<div class="dollSkinBtn" index="${i}" >${pic_data[i]["name"]}`; if(Number(pic_data[i]["anime"]) == 0) skin_btn_text += `<\/div>`; else if(Number(pic_data[i]["anime"]) == 1) skin_btn_text += `<div class="dollSkinAnimeL"><\/div><\/div>`; else if(Number(pic_data[i]["anime"]) == 2) skin_btn_text += `<div class="dollSkinAnimeA"><\/div><\/div>`; } skin_btn_text += `<div id="dollSkinBtnSpace"><\/div>`; skin_btn_text+=`<div id="dollSkinSwitchBtnDestroy" class="dollSkinSwitchBtn" dict="Normal-Destroy" state="Normal"> <div class="dollSkinSwitchBtnSlide"><\/div> <div id="dollSkinSwitchNormal" class="dollSkinSwitchBtnL">正常<\/div> <div id="dollSkinSwitchDestroy" class="dollSkinSwitchBtnR">重创<\/div> <\/div>`; if(pic_data[0]["pic_h"]){ skin_btn_text+=`<div id="dollSkinSwitchBtnHexie" class="dollSkinSwitchBtn" dict="Formal-Hexie" state="Formal"> <div class="dollSkinSwitchBtnSlide"><\/div> <div id="dollSkinSwitchFormal" class="dollSkinSwitchBtnL">正式<\/div> <div id="dollSkinSwitchHexie" class="dollSkinSwitchBtnR">和谐<\/div> <\/div>`; skin_btn_text += `<\/div>`; } else skin_btn_text += `<\/div>`; $("#dollPicDiv").append(skin_btn_text); skin_switch_btn_event("#dollSkinSwitchBtnHexie"); skin_btn_size(); // creat the select to offer changing home background options let select_text = `<select id="dollHomePic" style="display:none;"><\/select><div id="dollHomeDiv" class="dollPicBtn" state="off"><\/div>`; $("#dollPicDiv").append(select_text); for(i in homepic){ let option_text = `<option value=${homepic[i].pic}>${homepic[i].name}<\/option>`; $("#dollHomePic").append(option_text); } $("#dollHomePic").change(function(){ $("#dollPicBg").css({"background-image": "url(" + this.value + ")"}); }); } // if there is lots of skin, make it smaller to contain them all in the div. function skin_btn_size(){ if(pic_data.length >= 8 && $("#dollPicExpand").attr("state") == "off"){ let long = (16 - pic_data.length) < 2 ? 2 : 16 - pic_data.length; let margin_long = (30 - ((pic_data.length - 6) > 10 ? 10 : (pic_data.length - 6)) * 3); $(".dollSkinBtn").css({"padding": long + "px 2px", "margin": long + "px 0px"}); $("#dollSkinSwitchBtn").css({"margin-top": margin_long + "px"}); } } // the skin btn are so tight and ugly. undo. function un_skin_btn_size(){ if(pic_data.length <= 13){ $(".dollSkinBtn").css({"padding": "", "margin": ""}); $("#dollSkinSwitchBtn").css({"margin-top": ""}); } } // show dollHomePic select show or hide @click $("#dollHomeDiv").click(function(){ if($(this).attr("state") == "off"){ $(this).attr("state", "on"); $(this).css({"background-image": "url(/images/9/97/Home_hide.png)"}); $(this).prev("#dollHomePic").fadeIn(50); $(this).prev("#dollHomePic").animate({"width": "150px", "right": "50px"}, 200); } else { $(this).attr("state", "off"); $(this).css({"background-image": "url(/images/0/03/Home_show.png)"}); $(this).prev("#dollHomePic").fadeOut(150); $(this).prev("#dollHomePic").animate({"width": "40px", "right": "10px"}, 200); } }); // play voice if(dollvoice.length > 5){ var voice_jp = new Audio; voice_jp.setAttribute("src", dollvoice); voice_jp.setAttribute("controls", "controls"); voice_jp.setAttribute("preload", "preload"); $("#dollLineVoice").click(function(){ voice_jp.currentTime = 0; voice_jp.play(); }); } // skin chose button @click $(".dollSkinBtn").click(function(){ if(!firstload) load_pics(); $(".dollSkinBtn").removeClass("skinChosen"); $(this).addClass("skinChosen"); if($(this).text().indexOf("默认立绘") != -1 || $(this).text().indexOf("心智升级") != -1) $("#dollLineVoice").show(); else $("#dollLineVoice").hide(); let index = Number($(this).attr("index")); $("#dollLineWord").stop().fadeOut(90); setTimeout(() => { $("#dollLineWord").html(pic_data[index]["line"]); }, 95); setTimeout(() => { $("#dollLineWord").stop().fadeIn(100); }, 100); $("#dollSkinSwitchBtnHexie").remove(); if(pic_data[index]["pic_h"]){ skin_btn_text =`<div id="dollSkinSwitchBtnHexie" class="dollSkinSwitchBtn" dict="Formal-Hexie" state="Formal"> <div class="dollSkinSwitchBtnSlide"><\/div> <div id="dollSkinSwitchFormal" class="dollSkinSwitchBtnL">正式<\/div> <div id="dollSkinSwitchHexie" class="dollSkinSwitchBtnR">和谐<\/div> <\/div>`; $("#dollSkinBtnDiv").append(skin_btn_text); skin_switch_btn_event("#dollSkinSwitchBtnHexie"); skin_btn_size(); } doll_img_switch(); }); // hexie/destroy skin chose button @click function skin_switch_btn_event(target){ if(!target && !firstload) load_pics(); if(!target) target = ".dollSkinSwitchBtn"; $(target).click(function(){ let status = $(this).attr("dict").split("-"); if($(this).attr("state") == status[0]){ $(this).attr("state", status[1]); $(this).children(".dollSkinSwitchBtnSlide").stop().animate({"right": "0px", "left": "50%"}, 300); setTimeout(() => { $(this).children(".dollSkinSwitchBtnL").css({"color": "#eaeaea"}); $(this).children(".dollSkinSwitchBtnR").css({"color": "#292929"}); }, 100); } else { $(this).attr("state", status[0]); $(this).children(".dollSkinSwitchBtnSlide").stop().animate({"left": "0px", "right": "50%"}, 300); setTimeout(() => { $(this).children(".dollSkinSwitchBtnL").css({"color": "#292929"}, 300); $(this).children(".dollSkinSwitchBtnR").css({"color": "#eaeaea"}, 300); }, 100); } doll_img_switch(); }); } skin_switch_btn_event("#dollSkinSwitchBtnDestroy"); // doll img switch function function doll_img_switch(){ let index = Number($($(".skinChosen")[0]).attr("index")); let hex_state = "Formal"; if($("#dollSkinSwitchBtnHexie")) hex_state = $("#dollSkinSwitchBtnHexie").attr("state"); let des_state = $("#dollSkinSwitchBtnDestroy").attr("state"); let target = {"pic": pic_data[index]["pic"], "pic_d": pic_data[index]["pic_d"]}; if(hex_state == "Hexie") target = {"pic": pic_data[index]["pic_h"], "pic_d": pic_data[index]["pic_d_h"]}; let target_src = target["pic"]; if(des_state == "Destroy") target_src = target["pic_d"]; $("#dollPicDownload").children("a").attr("href", target_src); $("#dollPicImg").stop().fadeOut(190); setTimeout(() => { $("#dollPicImg").attr("src", ""); $("#dollPicImg").attr("src", target_src); }, 195); setTimeout(() => { $("#dollPicImg").stop().fadeIn(200); }, 200); } $("#dollPicImg").click(function(){ $("#dollDragBtn").click();}); // drag and scale mode switch button @click $("#dollDragBtn").click(function(){ if($(this).attr("state") == "off"){ $(this).attr("state", "on"); $(this).css("background-image", "url(/images/a/ad/IconDollDigoutUn.png)"); $("#dollPicImg").css("cursor", "crosshair"); $("#dollPicBg").css("cursor", "crosshair"); $("#dollPicImg").unbind("click"); // animation for hiding buttons $("#dollSkinBtnDiv").stop().animate({"left": "-200px"}, 500); $("#dollLineDiv").stop().animate({"bottom": "-200px"}, 500); if($("#dollHomeDiv").attr("state") == "on") $("#dollHomeDiv").click(); $("#dollPicDiv").mousedown(function(event){ pic_on_dragging = true; pic_position_before.x = event.clientX; pic_position_before.y = event.clientY; pic_position_change.x = 0 pic_position_change.y = 0 }); $("#dollPicDiv").mousemove(function(event){ if(pic_on_dragging){ pic_position_after.x = event.clientX; pic_position_after.y = event.clientY; pic_move.x += pic_position_after.x - pic_position_before.x; pic_move.y += pic_position_after.y - pic_position_before.y; pic_position_change.x += pic_position_after.x - pic_position_before.x; pic_position_change.y += pic_position_after.y - pic_position_before.y; pic_position_before.x = pic_position_after.x; pic_position_before.y = pic_position_after.y; $("#dollPicImg").css("top", String(pic_move.y) + "px"); $("#dollPicImg").css("left", String(pic_move.x) + "px"); } }); $("#dollPicDiv").mouseup(function(){ pic_on_dragging = false; }); // this for click and trigger the dragbtn $("#dollPicImg").click(function(){ if(pic_position_change.x == 0 && pic_position_change.y == 0 && $("#dollDragBtn").attr("state") == "on") $("#dollDragBtn").click(); pic_position_change.x = 0 pic_position_change.y = 0 }); if(document.querySelector("#dollPicDiv").addEventListener){ document.querySelector("#dollPicDiv").addEventListener('wheel', doll_pic_scale); } } else { $(this).attr("state", "off"); $(this).css("background-image", "url(/images/7/7d/IconDollDigout.png)"); if($("#dollPicExpand").attr("state") == "off") $("body").css("overflow", "auto"); $("#dollPicImg").css("cursor", "auto"); $("#dollPicBg").css("cursor", "auto"); // animation for hiding buttons if(window.innerWidth <= 600) $("#dollSkinBtnDiv").stop().animate({"left": "2px"}, 500); else $("#dollSkinBtnDiv").stop().animate({"left": "15px"}, 500); $("#dollHomePic").stop().animate({"right": "2px"}, 500); $("#dollLineDiv").stop().animate({"bottom": "20px"}, 500); document.querySelector("#dollPicDiv").removeEventListener("wheel", doll_pic_scale); $("#dollPicDiv").unbind("mousedown").unbind("mousemove").unbind("mouseup"); setTimeout(function(){ $("#dollPicImg").click(function(){ $("#dollDragBtn").click();}); }, 100); } }); // for a easy and feasible way to remove eventListener @mousewheel function doll_pic_scale(event){ event.preventDefault(); var box = document.querySelector("#dollPicImg").getBoundingClientRect(); event.wheelDelta = event.wheelDelta ? event.wheelDelta : (event.deltalY * (-40)); if (event.wheelDelta > 0) { pic_scale += 0.1; if(pic_scale >= 10) pic_scale = 10; parament = pic_scale / (pic_scale - 0.1) - 1; pic_move["x"] = pic_move["x"] - (event.clientX - box.left) * parament; pic_move["y"] = pic_move["y"] - (event.clientY - box.top) * parament; } else { pic_scale -= 0.1; if(pic_scale <= 0.2) pic_scale = 0.2; parament = pic_scale / (pic_scale + 0.1) - 1; pic_move["x"] = pic_move["x"] - (event.clientX - box.left) * parament; pic_move["y"] = pic_move["y"] - (event.clientY - box.top) * parament; } $("#dollPicImg").css("top", String(pic_move["y"]) + "px"); $("#dollPicImg").css("left", String(pic_move["x"]) + "px"); $("#dollPicImg").css("height", String(100 * pic_scale) + "%"); } // reset the position of pic, and paramas reinitial (different between expanded or not) @click $("#dollPicPositionRe").click(function(){pic_position_reset(100)}); // to move the pic to the right position, creat a function function pic_position_reset(time){ if($("#dollPicExpand").attr("state") == "off"){ let target_width = ($("#dollPicContain").width() < 200) ? window.innerWidth - 20 : $("#dollPicContain").width(); let initial_scale = (target_width < $("#dollPicContain").height()) ? (1.5 *target_width / $("#dollPicContain").height()) : 1.5; let initial_x = (target_width - $("#dollPicContain").height() * initial_scale) / 2; let initial_y = (initial_scale > 1) ? 0 : ($("#dollPicContain").height() * (1 - initial_scale) / 2); pic_move = {x: initial_x, y: initial_y}; pic_scale = initial_scale; } else { pic_scale = (window.innerWidth < window.innerHeight) ? (window.innerWidth / window.innerHeight) : 1; pic_move.x = (pic_scale < 1) ? 0 : (window.innerWidth - window.innerHeight) / 2; pic_move.y = (pic_scale == 1) ? 0 : (window.innerHeight - window.innerWidth) / 2; } pic_position_before = {x: 0, y: 0}; pic_position_after = {x: 0, y: 0}; $("#dollPicImg").stop().animate({ "top": String(pic_move["y"]) + "px", "left": String(pic_move["x"]) + "px", "height": String(100 * pic_scale) + "%" }, time); } // to expand the dollpicdiv or unexpand, and other measures @click $("#dollPicExpand").click(function(){ if($(this).attr("state") == "off"){ $(this).attr({"state": "on"}); $(this).css("background-image", "url(/images/e/e1/IconDollExpandUn.png)"); expand_function(); } else { $(this).attr("state", "off"); $(this).css("background-image", "url(/images/f/f6/IconDollExpand.png)"); $("#dollPicDiv").css({"position": "relative", "border": "", "z-index":""}); $("#dollPicDiv").stop().animate({"height": $("#dollPicContain").height() + "px", "width": $("#dollPicContain").width() + "px"}, 450); $("#dollPicPositionRe").click(); $("#dollPicImg").stop().animate({ "left": initial_para.x + "px", "top": initial_para.y + "px", "height": String(100 * initial_para.scale) + "%"}, 450); setTimeout(function(){ $("#mw-navigation").fadeIn(200) $(".comment-replybox").fadeIn(200) $("body").css({"overflow": "auto"}); $(".backToTop").css({"right": ""}); }, 400); $("#dollPicPositionRe").click(); setTimeout(() => { skin_btn_size();}, 450); } }); function expand_function(){ // some gfwiki'ui is really disgusting, although it's joking, but i need to hide them $("#mw-navigation").hide(); $(".comment-replybox").hide(); $("body").css({"overflow": "hidden"}); $(".backToTop").css({"right": "-500px"}); // main commands to control the div and pic moving $("#dollPicDiv").css({"position": "fixed", "left": "0px", "top": "0px", "border": "none", "z-index":"100"}); $("#dollPicDiv").stop().animate({"width": window.innerWidth + "px", "height": window.innerHeight + "px"}, 600); // although it's not very good, but i made it anyway var scale = (window.innerWidth < window.innerHeight) ? (window.innerWidth / window.innerHeight) : 1; var move_x = (scale < 1) ? 0 : (window.innerWidth - window.innerHeight) / 2; var move_y = (scale == 1) ? 0 : (window.innerHeight - window.innerWidth) / 2; $("#dollPicPositionRe").click(); $("#dollPicImg").stop().animate({ "left": move_x + "px", "top": move_y + "px", "height": String(100 * scale) + "%"}, 600); setTimeout(() => { un_skin_btn_size();}, 600); } // if the size of window changed , trigger this $(window).resize(function() { if($("#dollPicExpand").attr("state") == "on"){ expand_function(); } }); })</script></includeonly>
返回至
Widget:DollPage/Pic
。