espace Posted February 20, 2017 Share Posted February 20, 2017 hi, it's very strange for me but the background color doesn't appears. i have put a screenshot of my game and white corner appears. However the background color is correctly set, normally all my scene is grey ('#1a1a1a'). i don't understand the reason. Can you enlighten me on this ? var bootstate= { preload: function(){ this.load.image("loading","assets/loading.png"); this.load.image("loading_back","assets/loading_back.png"); }, create: function(){ this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL this.scale.pageAlignHorizontally = true this.scale.pageAlignVertically = true this.game.stage.backgroundColor='#1a1a1a' this.state.start("preload"); } } i have follow this jsfiddle and all seems good .... https://jsfiddle.net/end3r/6a64vecL/?utm_source=website&utm_medium=embed&utm_campaign=6a64vecL Link to comment Share on other sites More sharing options...
ldd Posted February 21, 2017 Share Posted February 21, 2017 Set a background color to the page itself (in index.html, add CSS that gives a background color to the page) This is probably because you are not using the scale manager, or your initial game dimensions are wrong (check game.width, game.height and compare with window.innerHeight) Link to comment Share on other sites More sharing options...
espace Posted February 21, 2017 Author Share Posted February 21, 2017 hi idd, thanks i have found my error with yours advices; my style.css are wrong so i put the settings directly in my index.html and that works. But i have still black border on the top. Do you know the setting rule to avoid that ? I put my settings below ; <!DOCTYPE HTML> <html> <head> <title>Papermania</title> <link rel="shortcut icon" href="favicon.png" type="image/x-icon" /> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="chrome=1, IE=9"> <meta name="format-detection" content="telephone=no"> <meta name="HandheldFriendly" content="true" /> <meta name="robots" content="noindex,nofollow" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta name="apple-mobile-web-app-title" content="Phaser App"> <script src="phaser.min.js"></script> <script src="src/main.js"></script> <style> body { margin: auto; display: table; position: absolute; border:0px; top: 0px; left: 0px; padding: 0; margin: 0; background-color: #1a1a1a } </style> </head> </body> </html> Link to comment Share on other sites More sharing options...
espace Posted February 21, 2017 Author Share Posted February 21, 2017 very strange at home no black border and at desk black border. Link to comment Share on other sites More sharing options...
Recommended Posts