Windows Phone 8 Javascript画布不在整个页面上
我正在创建一个WindowsPhone8JavaScript应用程序 但我有一个问题我解决不了 我正在使用画布,但画布处于纵向模式,仅占屏幕的1/4。。。(在我的诺基亚Lumia 520上开发) 我的画布的宽度和高度是:Windows Phone 8 Javascript画布不在整个页面上,javascript,css,html,canvas,windows-phone-8,Javascript,Css,Html,Canvas,Windows Phone 8,我正在创建一个WindowsPhone8JavaScript应用程序 但我有一个问题我解决不了 我正在使用画布,但画布处于纵向模式,仅占屏幕的1/4。。。(在我的诺基亚Lumia 520上开发) 我的画布的宽度和高度是: canvas.width = window.innerWidth; //480 canvas.height = window.innerHeight; //800 我的CSS: * { margin:0; padding:0; } /* to remove the top a
canvas.width = window.innerWidth; //480
canvas.height = window.innerHeight; //800
我的CSS:
* { margin:0; padding:0; } /* to remove the top and left whitespace */
html, body { width:100%; height:100%; } /* just to be sure these are full screen*/
@media screen and (-ms-view-state: fullscreen-landscape) {
}
@media screen and (-ms-view-state: filled) {
}
@media screen and (-ms-view-state: snapped) {
}
@media screen and (-ms-view-state: fullscreen-portrait) {
}
我的XAML:
<Grid x:Name="LayoutRoot" Background="Transparent">
<phone:WebBrowser x:Name="Browser"
Loaded="Browser_Loaded"
NavigationFailed="Browser_NavigationFailed"
IsScriptEnabled="True"
/>
</Grid>
有人知道我在整个页面上使用画布时遗漏了什么吗?这似乎有效:
window.devicePixelRatio = window.devicePixelRatio || window.screen.availWidth / document.documentElement.clientWidth;
W = (window.innerWidth / window.devicePixelRatio); // Window's width
H = (window.innerHeight / window.devicePixelRatio); // Window's height
canvas.width = W;
canvas.height = H;
一句话:
它在纵向上起作用,但在横向上不起作用…看看是否能帮到你。不起作用。。。My window.devicePixelRatio未定义,window.screen.deviceXDPI为96,window.screen.logicalXDPI也为96
window.devicePixelRatio = window.devicePixelRatio || window.screen.availWidth / document.documentElement.clientWidth;
W = (window.innerWidth / window.devicePixelRatio); // Window's width
H = (window.innerHeight / window.devicePixelRatio); // Window's height
canvas.width = W;
canvas.height = H;