fettig.net

A few iPhone Safari notes

Posted by Abe on Friday, June 29, 2007 @ 8:36 pm

Some notes on Safari on the iPhone, from the perspective of a web developer: 

  • Poking around the DOM, I don’t see any special objects, with the possible exception of window.offscreenBuffering (set to true).
  • Bookmarklets work, although you have to go through the bookmarks menu to get to them.
  • The javascript shell bookmarklet is tantalizingly close to working, but doesn’t actually evaluate what you’ve entered when you hit enter - it just goes to a newline. This is probably easy to fix.
  • Update: the problem appears to be the fact that you only get an onkeypress event after you hit enter on the virtual keyboard, and even then the keyCode is equal to 0. I tried modifying the script to execute whenever keyCode is 0, but that made Safari crash! Does that make me the first civilian to crash Safari?
  • Safari crashes are handled gracefully - the main screen fades back in, and you can jump right back into Safari. It will then load page you were visiting when it crashed.
  • Drag and drop, and other behaviors based on picking up mousemove events, don’t work. CSS-based element drag and drop doesn’t work either. Dragging one finger around the iPhone’s version of Safari causes the window to scroll, and that’s it. I assume that scroll events do work. I’m sure somebody is already working on a version of drag and drop based on window scrolling.
  • For documents with no width set, the iPhone uses a default width of 980px.
  • alert() works.

I’ll post more things as I discover them, or feel free to add your own in the comments.

12 Comments

  1. […] Apparently drag and drop doesn’t work with the iPhone, as it’s used for scrolling. That’s to be expected, I guess. […]

    Pingback by Make the most of the iPhone SDK › Vacuous Virtuoso — June 29, 2007 @ 9:28 pm

  2. […] Fettig has been jotting down his notes, which […]

    Pingback by Ajax Girl » Blog Archive » iPhone Safari Notes and Quirks — June 30, 2007 @ 3:44 am

  3. How about sheet-menus, like for entering username/password on a website. In Safari on Mac you get a sheet.

    Comment by Oskar L-B — June 30, 2007 @ 2:27 pm

  4. Hi Abe,

    for those of us geographically challenged, do you mind a couple of questions?

    Is the rendering engine Safari 2 or 3 based? Good way to tell would be does it do border-radius and box-shadow (probably need -webkit- prefix)?

    thanks - muchos envy,

    j

    Comment by John — June 30, 2007 @ 6:18 pm

  5. John - It is Safari 3 based. You can see this from the user agent, which reveals the WebKit build to be “420+” (current Safari 3 betas are build 422). Properties like -webkit-border-radius do work.

    I hope you get your Australian iPhone soon :)

    Oskar - there are no sheet menus per se on the iPhone, but you do get a full-screen username/password dialog if you try to access a page that requires HTTP authentication.

    Comment by Abe — June 30, 2007 @ 11:00 pm

  6. Abe,

    thanks so much - very helpful

    We may be waiting here some time :-(

    j

    Comment by John — July 1, 2007 @ 1:40 am

  7. Hmm, I’m not believing that this is 420+, as there is no SVG support enabled…

    Comment by Dylan Schiemann — July 1, 2007 @ 2:33 am

  8. You might be interested in the www.iPhoneWebDev.com community — there has been a lot of discussion today on how best to do viewports, how to turn off scaling, and other issues of web design and web apps for the iPhone. There is also a barcamp conference next week in SF, info at www.iPhoneDevCamp.com.

    Comment by Christopher Allen — July 1, 2007 @ 3:04 am

  9. Dylan - No SVG? That’s disappointing. Still, I’m not sure if that’s connected to how new or old the build is. They may have just turned SVG support off when they did the custom WebKit build for the iPhone.

    Comment by Abe — July 1, 2007 @ 8:20 am

  10. […] A few iPhone Safari notes […]

    Pingback by Some iPhone Links « Mike Cane’s Blog — July 2, 2007 @ 2:34 pm

  11. […] Fetting explores programming for the iPhone posted by admin at 2:31 pm […]

    Pingback by JavaScript New Update: | JavaScript Weblog — July 2, 2007 @ 4:46 pm

  12. Have been experimenting with audio support. Can’t get any audio to autoplay (.wav, .mp3, or .midi). Embedding .mp3 to be played by the quicktime player works, though it brings up controls that then switch to a fullscreen player mode. As of now it would appear that all custom iPhone apps will have to be silent.

    Comment by Grayson — July 6, 2007 @ 12:57 am

RSS feed for comments on this post.

Sorry, the comment form is closed at this time.