Contactez-moi
Qui est MacPatrice
This template is to help web developers create applications for the iPhone. Notice it uses the Apple images for the 'Home' and 'Contact' button in the toolbar. (these buttons are visible in Safari) This uses javascript to simulate the page turning within the hierarchy too. Replace the email address in the code with yours and a desired subject line.
I've tried to write this in a manner that you can follow the code and make sense of the structure so that you can create comprehensive menu systems. Please use this at your discretion, but I would enjoy a link back if you do. Spread the word on iPhone web app development and suggest this package to others.
Finished
You Navigated: Home / Apples / Apples 1
You can add any "normal" code here for the final destination page - an image, mp3, it's up to you.
Finished
You Navigated: Home / Apples / Apples 2
You can add any "normal" code here for the final destination page - an image, mp3, it's up to you.
Finished
You Navigated: Home / Oranges / Oranges 1
You can add any "normal" code here for the final destination page - an image, mp3, it's up to you.
Finished
You Navigated: Home / Oranges / Oranges 2
You can add any "normal" code here for the final destination page - an image, mp3, it's up to you.
Quelques liens utiles
iPhone Detection
Your 'normal' website can detect an iphone and direct users to an iPhone friendly version of a site by adding this code to the header of the 'normal' website.
<script language=javascript>
<!--
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)))
{
location.replace("iphone-version.html");
}
-->
</script>
Replace "iphone-version.html" with the location of the iPhone site.
Web Clip Icons
Replace the 'icon.png' image to add your own web clipping icon. The code to call the icon is included in the template
Page Decor
Currently, included are 2 classes:
class="panel" and class="plain"
This controls the page layout to be either blank or have the pinstrip background. Add your own class in the CSS and a background image to create your own.
Editing
Removing the iui.css line in the header will make editing your pages in Dreamwever easier. Be sure to add it back to your live site when finished.
Adding Special Features
Phone Number Links
You may want to build your page to contain a phone number.
If you do, then use this code:
<a href="tel:555-1212" target="_self">Call Me</a>
and it will function like: Call Me
Open Map Links
If you want to open Google Maps to an address, use this code:
<a href = 'http://maps.google.com/maps?q=1+Infinite+Loop,+Cupertino,+CA+95014'" target="_self">Apple Location</a>
and it will function like this:
Apple Location
Add Audio/QT
You can add an .mp3 or QT movie too. Remember, iPhone Safari doesn't render Flash, so use an .mp3 file in this manner:
<a class="borderImageBtn qtButton" onclick="window.location.href = 'audio.mp3'">Listen To Audio</a>
and it will function like like:
Listen To Audio
Audio Tip: Decreasing the file size of .mps'3 helps your users by decreasing download time. Using QuickTime to Export your file to ACC, 32 rate will produce a much smaller .mov file of your mp3.
Help Me Out
If you have found this template useful could you consider buying me some coffee?
Even a dollar would help me out:) and I can continue to develop more advanced templates.
Thanks for the consideration, I hope this has been useful to you.
Knox