メインメニューを開く
アークナイツwiki-ANwiki
β
検索
Widget:Hp-buttonのソースを表示
←
Widget:Hp-button
あなたには「このページの編集」を行う権限がありません。理由は以下の通りです:
この操作は、以下のグループに属する利用者のみが実行できます:
登録利用者
。
Widget
名前空間にあるページを編集する権限がありません。
このページのソースの閲覧やコピーができます。
<style> .hp-btn-can { display: inline-block; position: relative; width: 220px; height: 100px; top: 0px; left: -10px; overflow: hidden; cursor: default; } .hp-btn-bg-can, .hp-btn-top-left-can, .hp-btn-top-right-can, .hp-btn-circuits-box-can, .hp-btn-circuits-can, .hp-btn-text-box-can, .hp-btn-text-can, .hp-btn-icon-can, .hp-btn-icon-can-1, .hp-btn-icon-can-2, .hp-btn-icon-can-3, .hp-btn-icon-can-4, .hp-btn-link-can { display: block; position: absolute; } .hp-btn-bg-can { top: 25px; left: 2px; } .hp-btn-top-left-can, .hp-btn-top-right-can { top: 10px; left: 15px; } .hp-btn-text-box-can { top: 40px; left: 63px; height: 36px; width: 130px; overflow: hidden; } .hp-btn-bg-can, .hp-btn-top-left-can, .hp-btn-top-right-can { filter: drop-shadow(0 0 2px black); transition: filter 1s; -webkit-transition: filter 1s; } .hp-btn-can:hover .hp-btn-bg-can, .hp-btn-can:hover .hp-btn-top-left-can, .hp-btn-can:hover .hp-btn-top-right-can { filter: drop-shadow(0 0 2px white); } .hp-btn-text-can { bottom: 50%; width: 110px; transform: translateY(50%); text-align: center; text-shadow: 0 0 2px black; color: #FFFFFF; font-size: 24px; font-weight: 700; left: 3px; transition: left 1s; -webkit-transition: left 1s; } .hp-btn-can:hover .hp-btn-text-can { left: 20px; } .hp-btn-icon-can { top: 0px; left: 0px; opacity: 0; transition: opacity 1s; -webkit-transition: opacity 1s; } .hp-btn-icon-can-1 { top: 70px; left: 108px; opacity: 0; transition: opacity 1s; -webkit-transition: opacity 0.8s; } .hp-btn-icon-can-2 { top: 70px; left: 118px; opacity: 0; transition: opacity 1s; -webkit-transition: opacity 1.6s; } .hp-btn-icon-can-3 { top: 70px; left: 126px; opacity: 0; transition: opacity 1s; -webkit-transition: opacity 2s; } .hp-btn-icon-can-4 { top: 25px; left: 2px; opacity: 0; transition: opacity 1s; -webkit-transition: opacity 1s; } .hp-btn-can:hover .hp-btn-icon-can { opacity: 1 } .hp-btn-can:hover .hp-btn-icon-can-1 { opacity: 1 } .hp-btn-can:hover .hp-btn-icon-can-2 { opacity: 1 } .hp-btn-can:hover .hp-btn-icon-can-3 { opacity: 1 } .hp-btn-can:hover .hp-btn-icon-can-4 { opacity: 1 } .hp-btn-link-can { top: 33px; left: 40px; } .hp-btn-circuits-can { left: 0; bottom: 0; transition: left 6s; -webkit-transition: left 6s; } .hp-btn-circuits-box-can { bottom: 8px; left: 35px; width: 130px; overflow: hidden; } .hp-btn-can:hover .hp-btn-circuits-can { left: 0px; } </style>
Widget:Hp-button
に戻る。