HTML and CSS Reference
In-Depth Information
First, try out the program on your computer. You should see exactly what you saw when you
originally tested it (refer to Figure 9-12). Now, try it out in a mobile browser. Instead of a large
image pushing all the text to one side, you see a smaller image surrounded by text, just like
the one on your computer. h at's because the Web page was able to use the JavaScript to
determine whether the page was loaded by an iPhone or some other platform or device.
Place the Web page i le and both of the images in their folder into the same directory on a
server. When you test it, it looks like it was made for the iPhone, but it was really made for the
iPhone or any other device. Using this and other JavaScript code, you can do a lot more with
HTML5 than you can with just HTML5 by itself.
193
Figure 9-14: Displaying a small graphic for a mobile device.
h e JavaScript used in the example is as minimalist as possible. However, the logic of it can be
outlined as follows:
Place the contents of
navigator.appVersion
into a variable named
envir
(short for
environment).
