Prevent running transitions on load (http://www.pencilscoop.com/2014/03/prevent-css-transitions-running-on-page-load/)

2015-03-22 15:56:29 +00:00
parent 2865bf31bd
commit 58cbd80d67
3 changed files with 15 additions and 1 deletions
--- a/footer.php
+++ b/footer.php
@@ -39,5 +39,12 @@ if ( in_array( 'reCAPTCHA', $dependencies ) ) { ?>
 	<script src='https://www.google.com/recaptcha/api.js'></script>
 <?php } ?>

+<script>
+	window.addEventListener('load',function load() {
+		window.removeEventListener('load', load, false);
+		document.body.classList.remove('load');
+	},false);
+</script>
+
 </body>
 </html>
--- a/header.php
+++ b/header.php
@@ -50,7 +50,7 @@ isq_load_textdomain();
 		<meta name="theme-color" content="#013f6d">
 	</head>

-	<body>
+	<body class="load">

 		<div class="wrapper">

--- a/public/style.css
+++ b/public/style.css
@@ -42,6 +42,13 @@ body, input {
 	}
 }

+.load * {
+	-webkit-transition: none !important;
+	-moz-transition: none !important;
+	-ms-transition: none !important;
+	-o-transition: none !important;
+}
+
 /* Structure and global design */
 a, a:visited {
 	color: #013F6D;