i want
to create a webpage on iphone ,
but i can't complete it in a simple way,
this is my code:
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=5.0,user-scalable=yes">
</head>
<body onorientationchange="updateOrientation();" onload=updateOrientation()>
<div id="a">
<input id='ab' type="button" value="button" />
</div>
<div id=b style="display: none">sssadwq dwqdqw</div>
<style type="text/css">
*{
margin:0;
padding:0;
}
/* Reposition on orientation change */
body.landscape{
height: 268px;
}
body.landscape #a{
height:134px;
line-height:134px;
}
body.landscape #b{
height:114px;
width:470px;
}
body{
height: 416px;
}
#a{
line-height:208px;
height:208px;
text-align:center;
}
#b{
height:198px;
width:310px;
background:red;
border:5px solid black;
}
</style>
<script src="jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
function updateOrientation() {
var orientation = window.orientation;
switch (orientation) {
// If we're horizontal
case 90:
case -90:
// Set orient
to landscape
$(document.body).addClass("landscape");
break;
// If we're vertical
default:
// Set orient
to portrait
$(document.body).removeClass("landscape");
break;
}
}
$('#ab').click(function(){
if($('#b').css('display')=='none')$('#b').css('display','block')
else $('#b').css('display','none')
})
</script>
</body>
</html>
it use much more fixed number,this is not the best way ,i think the best way is
to
use the percentage more and more,
can you do it fo me ,,
thanks
