Feeds:
Posts
Comments

Archive for the ‘Uncategorized’ Category

iPhone Web Keyboards

Mobile Safari supports multiple new input types, and displays separate keyboards for each.

I found the following image on twitpic, posted there by Remi Grumeau.

I think that the image speaks for itself as a reference for the different input types supported.

Advertisements

Read Full Post »

Here’s a few useful links for learning HTML5:

Read Full Post »

Touch events on the iPad work like they do on the iPhone. You can attach event listeners two DOM elements and have listeners called when an event occurs. Apple has provides this resource which provides a nice example which I thought might be good to simplify.

Basically what you need to do is :

1) Attach a listener to an element

 <div id="_mcePaste">
   <div id="box" style="height:225px;width:225px;background:red;position:absolute"</div>
   <div>ontouchmove="touchMove(event)"</div>
   <div>ontouchstart="touchStart(event)"</div>
 </div>

2) Do something when an event occurs

function touchStart( e ) {
 var box = document.getElementById("box");
 box.style.background = "green";
 e.preventDefault();
 return false;
}
function touchMove( e ) {
 var targetEvent =  e.touches.item(0);
 var box = document.getElementById("box");
 box.style.background = "yellow";
 box.style.left = targetEvent.clientX + "px";
 box.style.top= targetEvent.clientY + "px";
 e.preventDefault();
 return false;
}

It is important to have the  e.preventDefault(); in the  the event handler to prevent the event from being propagated to the browser and causing unwanted scrolling events.

I have created a full working example with source here. You will need an iPhone or iPad simulator to test this code.

Read Full Post »

iPad User Agent

For those interested here is the full user agent provided by the iPad simulator released yesterday.

navigator.userAgent = Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B320c Safari/531.21.10

Update: The User-Agent as of the 3.2 Beta 5 is “Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B360 Safari/531.21.10”.

Read Full Post »

iPad Browser

With the iPad, Web developers have a new platform to create a rich web experience with HTML 5. Having devoted my life to web applications, I’m excited to test the waters.
iPad Browser

Today the only way we can experience the iPad is through the iPhone 2.3 Beta SDK. I eagerly downloaded and installed the SDK and was sad to find no web browser in the emulator! I’m still new to iPhone app development so I looked around and found an Web Browser Tutorial on DBlog. I took it and with a few tweaks added a simple location bar and “Go” button as well as enabled the larger iPad sized format.

While I’m sure Safari will be in one of the future updates to the SDK, this application will work today. Find the iPad Browser on Github.

In the coming weeks we three amigos hope to blog more about the iPad, especially the web capabilities of the device. After just 3 days with the iPad emulator and this browser, I am hooked.

Read Full Post »