Widget:SpoilerAlert: Difference between revisions
From Unforgotten Realms Wiki
Jump to navigationJump to search
imported>Pillowkeeper mNo edit summary |
imported>Pillowkeeper mNo edit summary |
||
| Line 12: | Line 12: | ||
var x = document.getElementById("snackbar") | var x = document.getElementById("snackbar") | ||
x.className = "show"; | x.className = "show"; | ||
setTimeout(function(){ x.className = x.className.replace("show", ""); }, | setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000); | ||
} | } | ||
window.onload = myFunction(); | window.onload = myFunction(); | ||
| Line 33: | Line 33: | ||
#snackbar.show { | #snackbar.show { | ||
visibility: visible; | visibility: visible; | ||
-webkit-animation: fadein 0.5s, fadeout 0.5s | -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s; | ||
animation: fadein 0.5s, fadeout 0.5s | animation: fadein 0.5s, fadeout 0.5s 2.5s; | ||
} | } | ||
Revision as of 05:25, 22 April 2017
<tbody></tbody>
| <img src="/images/thumb/7/70/Interrupt_gem.png/90px-Interrupt_gem.png" width="90" height="89" srcset="/images/thumb/7/70/Interrupt_gem.png/135px-Interrupt_gem.png 1.5x, /images/thumb/7/70/Interrupt_gem.png/180px-Interrupt_gem.png 2x"> | Warning! The following page contains spoilers for the most recent content! | <img src="/images/thumb/f/f2/Coe_Terrible.png/90px-Coe_Terrible.png" width="90" height="90" srcset="/images/thumb/f/f2/Coe_Terrible.png/135px-Coe_Terrible.png 1.5x, /images/thumb/f/f2/Coe_Terrible.png/180px-Coe_Terrible.png 2x"> |
<script> function myFunction() {
var x = document.getElementById("snackbar")
x.className = "show";
setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
} window.onload = myFunction(); </script>
<style>
- snackbar {
margin:auto; text-align:center; visibility: hidden; margin-left: -225px; border-radius: 15px; padding: 16px; position: fixed; z-index: 2; left: 475px; top: 40px;
}
- snackbar.show {
visibility: visible; -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s; animation: fadein 0.5s, fadeout 0.5s 2.5s;
}
@-webkit-keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 30px; opacity: 1;}
}
@keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 30px; opacity: 1;}
}
@-webkit-keyframes fadeout {
from {bottom: 30px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}
@keyframes fadeout {
from {bottom: 30px; opacity: 1;}
to {bottom: 0; opacity: 0;}
} </style>
