did you know some good web site about 'iphone css layouts' ,and can you help me to improve my code_问答_开发者

did you know some good web site about 'iphone css layouts' ,and can you help me to improve my code

开发者 https://www.devze.com 2022-12-23 04:46 出处：网络

i want to create a webpage on iphone , but i can\'t completeit in a simple way, this is my code: <!DOCTYPE html PUBLIC \"-//WAPFORUM//DTD XHTML Mobile 1.0//EN\" \"http://www.wapforum.org/DTD/xht

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

http://iwebkit.net/

http://matthewjamestaylor.com/blog/perfect-multi-column-liquid-layouts

Download xCode, and use DashCode. It will do the work for you. Or, try out iWebkit.

I'd look into http://www.jqtouch.com/ ... a really nice jQuery plugin that will really do a lot of the hard work for you.