1. Due to the recent site upgrade, the iPadForums (iPF) App will no longer work. The new iPadForums.net website has been designed from the ground up to work perfectly from any mobile, tablet, or desktop computer using the built in internet browser. Create a shortcut to iPadForums.net on your home screen by following these steps: Create an icon for iPadForums.net

Problems on web site design, items not loaded

Discussion in 'iPad 2 Forum' started by n3urona, Jun 27, 2012.

  1. n3urona
    Offline

    n3urona iPF Noob

    Joined:
    Jun 27, 2012
    Messages:
    1
    Thanks Received:
    0
    Trophy Points:
    0
    Location:
    Monterrey MX
    Ratings:
    +0 / 0
    Hi everybody, probably there is another thread with this topic, but i didn't find it...

    I have an issue, i'm new designing sites with ipad compatibility.... and i have some problems on my pages...

    First... all the information are stored in a sharepoint site, and i developed some webparts for show some info with a light html structure...

    I have a base html page for all my diferent pages and is this....

    HTML:
    <body>    <div id="iPadContainer">        <div id="iPadHeaderZone">Mis Asignaciones</div>        <div id="iPadUserZone">            <!-- BEGIN WEBPART(UsuarioBitacora)-->            <!-- next html is the example of the webpart result, wher the page is redered-->            <div id="usrImg"><img src="imgs/usr.tmbnail.jpg" class="usrThumbnail" /></div>            <div id="usrName">D. Guillermo Avilez</div>            <!--END WEBPART-->        </div>        <div id="iPadMenuZone">            <!-- BEGIN WEBPART(UsuarioBitacora)-->            <!-- next html is the example of the webpart result, wher the page is redered-->            <div class="btn"><a href=""><img src="imgs/btnAsignaciones.png" /></a></div>            <div class="btn"><a href=""><img src="imgs/btnPedidos.png" /></a></div>            <div class="btn"><a href=""><img src="imgs/btnCompromisos.png" /></a></div>            <div class="btn"><a href=""><img src="imgs/btnPendientes.png" /></a></div>            <div class="btn"><a href=""><img src="imgs/btnReuniones.png" /></a></div>            <div class="btn"><a href=""><img src="imgs/btnHistorico.png" /></a></div>            <!--END WEBPART-->        </div>        <div id="iPadBodyZone">        <!-- BEGIN WEBPART(VistaLista) -->
            <!-- END WEBPART-->        </div>    </div></body>
    also i have a css file with all styles, and is this...

    HTML:
    body{margin:0;font-family:Verdana; font-size:10px}#iPadContainer{width:1024px;min-height:468px; margin:0 auto; margin-top:10px;  }#iPadHeaderZone{width:834px;height:70px; margin-left:10px;  padding-top:40px; padding-right:10px; overflow:auto;  float:left; background-image:url("../imgs/bgHeader.png"); text-align:right;  font-size:2em; color:#ffffff; font-weight:bold}#iPadUserZone  {width:160px;height:100px; margin-left:10px; padding-top:10px; float:left; overflow:auto; background-image:url("../imgs/bgUser.jpg")}#iPadMenuZone{width:160px; min-height:618px; margin-top:10px; float:right;background-image:url("../imgs/bgMenu.png"); background-repeat:repeat-y;}#iPadBodyZone{width:844px;min-height:618px; margin-left:10px;margin-top:10px; float:left; overflow:auto;}#iPadBodyZoneBig{width:1000px;min-height:618px; margin-left:12px;margin-top:10px; float:left; overflow:auto;}#usrImg{width:55px; height:65px;margin:0 auto;}#usrName{width:150px; height:15px; margin:0 auto; color:#ffffff; font-weight:bold; padding-top:10px; overflow:hidden;text-align:center;}img.usrThumbnail{ width:55px; height:65px; }#iPadMenuZone div.btn{width:160px; height:103px; float:left;cursor:pointer;}#iPadMenuZone div.btn a img{border:0;}
    #iPadBodyZoneBig div.btn{width:170px; height:113px; float:left;cursor:pointer;background-image:url("../imgs/bgbtnBig.png"); margin:30px; padding-top:10px;padding-left:10px; background-position:center; background-repeat:no-repeat}#iPadBodyZoneBig div.btn a img{border:0;}#gridview{    width:100%;border: 0;    font-family:Verdana;    font-size:10px;    color:#333333;}
    #gridview tr{height:30px;}#gridview tr a{color:#333333;}#gridview tr td{padding:0px;}#gridview tr.tblHeaderMain{        background-image:url('../imgs/tblHeaderMain.png');     background-repeat:repeat-x;    height:40px;    font-weight:bold;    color: #ffffff;} #gridview tr.tblHeaderMain td a{color: #ffffff;}#gridview tr.tblHeaderMain td.tblL{width:20px;background-image:url('../imgs/tblHeaderLeft.png');}#gridview tr.tblHeaderMain td.tblR{width:20px;background-image:url('../imgs/tblHeaderRight.png');}#gridview tr.alternate{background-image:url('../imgs/alternate.png'); color:#C7113A;}#gridview tr.alternate a{color:#C7113A;}
    
    @media only screen and (orientation:portrait){    /* portrait styles here */
            #iPadContainer{width:768px}    #iPadHeaderZone{width:578px;height:70px; margin-left:10px;  padding-top:40px; padding-right:10px; overflow:auto;  float:left; background-image:url("../imgs/bgHeader_Portrait.png");background-repeat:no-repeat; text-align:right;  font-size:2em; color:#ffffff; font-weight:bold}    #iPadMenuZone{width:758px; min-height:103px; margin-top:10px; float:right;background-color:#C7113A;}                #iPadBodyZone{width:758px;min-height:530px; margin-left:10px;margin-top:10px; float:left; overflow:auto;}    #iPadBodyZoneBig{width:758px;min-height:618px; margin-left:12px;margin-top:10px; float:left; overflow:auto;}            #iPadMenuZone div.btn{width:160px; min-height:103px; float:left;cursor:pointer;}    #iPadMenuZone div.btn a img{border:0;}        #iPadBodyZoneBig div.btn{width:170px; height:113px; float:left;cursor:pointer;background-image:url("../imgs/bgbtnBig.png"); margin:30px; padding-top:10px;padding-left:10px; background-position:center; background-repeat:no-repeat}    #iPadBodyZoneBig div.btn a img{border:0;}                       #iPadMenuZone div.btn{width:100px; height:103px; float:left;cursor:pointer;}    #iPadMenuZone div.btn a img{border:0;}
                }
    
    i was testing the KB's weight for all requests with HttpWatch and accesing 11 pages i had only 149KB for all requests... in average each page has almost 14KB, i think that its a decent size...

    but there is some moments when the page request authentication and the browser looks froozen, i didnt find a pattern like when it happens, but is happening, if the site ask for credentials twice, all stuff is stoped... and i need to close my browser and start again...

    Some body could help ??

    Thanks in advance...
    Last edited: Jun 27, 2012

Share This Page