Discussion Forums  >  Uncategorized

Replies: 2    Views: 311

Vali
buzztouch Evangelist
Profile
Posts: 193
Reg: May 22, 2011
Bucharest
5,830
09/21/11 03:28 PM (14 years ago)

Custom URL display size

Hi, I know there were some topics related to how the iPhone displays the custom URL pages. Essentially, they look very small even if I define them with the proper sizes. Is there a way to fix the HTML code to the perfect size the iPhone displays? Could someone take a look at my code and tell me how can I adjust it? <!DOCTYPE html> <html> <head> <div style='margin-top:2px;margin-bottom:2px;height:480;width:320px;font-family:Arial,Helvetica,sans-serif;font-size:9px;color:#535353;background-color:#ffffff;border:2px solid #2a88ac;font-style:normal;text-align:right;padding:0px;padding-bottom:3px !important;'><iframe width='320' height='480' border='0' src='http://www.bikemap.net/route/993566/widget?width=480&height=320&extended=false&maptype=0&unit=km&redirect=no' frameborder='0' marginheight='0' marginwidth='0' scrolling='no'></iframe></div> </head> </html> Thanks a lot for any given tips !
 
MGoBlue
Apple Fan
Profile
Posts: 980
Reg: Jun 07, 2011
Gold River, CA
10,600
like
09/21/11 03:58 PM (14 years ago)
Hi @Moofa - A couple of suggestions for you. First, I think you're asking about custom html not custom url. Custom url won't let you load code like this. Or are you creating a webpage that you want your app to access? I wasn't clear. The code you listed above is incorrect. Try this instead (reember the forum takes out quote marks: <!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 /> <meta name=viewport content=width=320,user-scalable=false /> <title></title> <style type=text/css> p.sansserif{font-family:Arial,Helvetica,sans-serif; color:#000000;} h1{font-family:Arial,Helvetica,sans-serif; color:#000000;text-align: center; font-size:20px;} } </style> </head> <body> <div style='margin-top:2px;margin-bottom:2px;height:480;width:320px;font-family:Arial,Helvetica,sans-serif;font-size:9px;color:#535353;background-color:#ffffff;border:2px solid #2a88ac;font-style:normal;text-align:right;padding:0px;padding-bottom:3px !important;'><iframe width='320' height='480' border='0' src='http://www.bikemap.net/route/993566/widget?width=480&height=320&extended=false&maptype=0&unit=km&redirect=no' frameborder='0' marginheight='0' marginwidth='0' scrolling='no'></iframe></div> </body> </html> If you're just trying to add the bikemap.net to your app, just call the url directly. The site's mobile-optimized already and works great. I just did a test using the Custom URL and inserting 'http://www.bikemap.net/route/993566' Worked really well.
 
Vali
buzztouch Evangelist
Profile
Posts: 193
Reg: May 22, 2011
Bucharest
5,830
like
09/22/11 01:42 AM (14 years ago)
Indeed, I am talking about Custom HTML. Sorry for that. Second, with your code the page is well centered and sized. The only problem I have is that it does not take me to the actual map, but to the mobile version of the site. On the device is looks like here: http://imageshack.us/photo/my-images/6/pozt.png/ It should look like here: http://www.play-station.ro/app/map.html I guess the problem is overriding the device browser version because most sites will detect it and output a mobile format. If I switch to the normal web page of bikemap and reload the html or url page I get to see the actual track. Any thoughts about this?
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.