Skip to content

Instantly share code, notes, and snippets.

@graphis
Created October 6, 2016 21:07
Show Gist options
  • Save graphis/a1beb1fe4347fecf9147e577c7d9e689 to your computer and use it in GitHub Desktop.
Save graphis/a1beb1fe4347fecf9147e577c7d9e689 to your computer and use it in GitHub Desktop.
html5 js window resize
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
div#content {
background: #ffccff;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="underscore.js"></script>
<script type="text/javascript">
// RESIZE ///////////////////////////////////
function stage_in()
{
$( "body" ).append("did it");
$( "body" ).fadeIn( 500 );
//$( "body" ).fadeIn( "slow", function() {
// Animation complete
//});
}
function stage_out()
{
$( "body" ).fadeOut( 50 );
}
$(window).on('resize', function(e)
{
if (!e.isTrigger)
{
stage_out();
clearTimeout(this._timer);
this._timer = setTimeout(function()
{
stage_in();
}, 250);
}
});
// RESIZE ///////////////////////////////////
</script>
</head>
<body>
<div id="content">
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
aha<br/>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment