Я пытаюсь передать HTML-содержимое Javascript и CSS из локальных ресурсов приложения iPhone, и у меня возникают проблемы с обработкой событийOrientationChange и в том числе с внешним Javascript.
Кажется, я могу правильно связать CSS, но не javascript. Я пытаюсь использовать следующий пример обработки onOrientationChange (Как создать сайт iPhone), но я обслуживаю веб-страницу из своего приложения NSBundle mainBundle.
Я попытался подключить функцию javascript к body.onorientationchange и к window.onorientationchange, но ни один из них не работает, если вы используете UIWebView локально (или удаленно), но он работает, если я использую iPhone Safari.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>How to build an iPhone website</title>
<meta name="author" content="will" />
<meta name="copyright" content="copyright 2008 www.engageinteractive.co.uk" />
<meta name="description" content="Welcome to engege interactive on the iPhone!" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<link rel="apple-touch-icon" href="images/template/engage.png"/>
<style type="text/css">
@import url("iphone.css");
</style>
<!--
<script type="text/javascript" src="orientation.js"></script>
-->
<script type="text/javascript">
function updateOrientation(){
try {
var contentType = "show_normal";
switch(window.orientation){
case 0:
contentType = "show_normal";
break;
case -90:
contentType = "show_right";
break;
case 90:
contentType = "show_left";
break;
case 180:
contentType = "show_flipped";
break;
}
document.getElementById("page_wrapper").setAttribute("class", contentType);
//alert('ORIENTATION: ' + contentType);
}
catch(e) {
alert('ERROR:' + e.message);
}
}
window.onload = function initialLoad(){
try {
loaded();
updateOrientation();
}
catch(e) {
alert('ERROR:' + e.message);
}
}
function loaded() {
document.getElementById("page_wrapper").style.visibility = "visible";
}
</script>
</head>
<body onorientationchange="updateOrientation();">
<div id="page_wrapper">
<h1>Engage Interactive</h1>
<div id="content_left">
<p>You are now holding your phone to the left</p>
</div>
<div id="content_right">
<p>You are now holding your phone to the right</p>
</div>
<div id="content_normal">
<p>You are now holding your phone upright</p>
</div>
<div id="content_flipped">
<p>This doesn't work yet, but there is a chance apple will enable it at some point, so I've put it in anyway. You would be holding your phone upside down if it did work.</p>
</div>
</div>
</body>
</html>
