Last active
February 1, 2018 05:18
-
-
Save servercharlie/efa6eea2493fdd35d3192ec3066819c5 to your computer and use it in GitHub Desktop.
Proper PIXI window resizing, w/ jQuery.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
- Insert this after: | |
- referencing jquery.min.js | |
- referencing pixi.min.js | |
- creating your PIXI Application instance. | |
- Point being: | |
- Window resize binding fucks up if the document isn't ready yet, specially in Chrome. | |
- Hence, we use jQuery here to ensure the document is in fact ready first, | |
before we actually bind that shit. | |
- References: | |
- @ http://stackoverflow.com/questions/30554533/dynamically-resize-the-pixi-stage-and-its-contents-on-window-resize-and-window | |
*/ | |
var YourPixiApplication = new PIXI.Application({ | |
// pixi app options go here. | |
}); | |
$(document).ready(function(){ | |
$(window).resize(function(){ | |
// we multiplied it by 0.95 so it won't show scrollbars on browsers. | |
// remove it if you want. | |
var w = window.innerWidth * 0.95; | |
var h = window.innerHeight * 0.95; | |
//this part resizes the canvas but keeps ratio the same | |
YourPixiApplication.renderer.view.style.width = w + "px"; | |
YourPixiApplication.renderer.view.style.height = h + "px"; | |
//this part adjusts the ratio: | |
YourPixiApplication.renderer.resize(w,h); | |
}); | |
}); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment