1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 | /*轉蛋機噗寶*/ #dynamic_logo { /*這裡勿動*/ position:fixed; z-index:6000; width:250px; height:350px; display:flex; flex-direction:column; align-items: center; /*上下位置*/ bottom:60px; /*可改top*/ /*左右位置*/ right:10px; /*可改left*/ } #dynamic_logo:after, #dynamic_logo img { width:100%; display:block; transition:height 0s 1s; overflow:hidden; } #dynamic_logo:hover:after { height:0; transition:height 0s 1s; } #dynamic_logo:after { /*這裡勿動*/ height:100%; transition:height 0s; /*下面設定圖片*/ content: url("https://shrimpstack.000webhostapp.com/plurk_css/gashapon_machine.php? machine_front=& machine_back=& shell_down_front=& shell_down_back=& shell_up_front=& shell_up_back=& gashapon_1=& gashapon_2=& gashapon_3=& gashapon_4=& gashapon_5=& gashapon_6= "); } #dynamic_logo img { height:0; transition:height 0s; } #dynamic_logo:hover img { /*這裡勿動*/ height:100%; transition:height 0s 1s; /*下面設定圖片*/ content: url("https://shrimpstack.000webhostapp.com/plurk_css/gashapon_machine.php? machine_front=& machine_back=& shell_down_front=& shell_down_back=& shell_up_front=& shell_up_back=& gashapon_1=& gashapon_2=& gashapon_3=& gashapon_4=& gashapon_5=& gashapon_6=& obtain=6 "); } /*轉蛋機下方說明(可刪)*/ #dynamic_logo:before { /*這裡勿動*/ position:absolute; top:100%; white-space: pre-wrap; text-align:center; /*內容*/ content:"滑鼠停留兩秒轉一顆蛋重新整理可以重抽"; /*底色*/ background:#FFF; /*圓角*/ border-radius:5px; /*內距*/ padding:5px 10px; /*寬度*/ width:160px; /*邊框*/ border:1px solid #ddd; } |
Direct link: https://paste.plurk.com/show/9Xfl8skwOJvtjJ5XXazg