background preloader

HOWTO: Native iPhone/iPad apps in JavaScript

HOWTO: Native iPhone/iPad apps in JavaScript
More resources On top of the information below, I can recommend a few other resources: Building iPhone Apps with HTML, CSS, and JavaScript is the only book I found that covered everything. I highly recommend it if you're planning on doing serious app development in JavaScript. Making it full-screen Normally, if you press "+" in mobile Safari and then "Add to Home Screen," the icon it creates acts like a bookmark into Safari. To get rid of the URL and button bars, just add a meta tag: This is what my log app looks like when launched from the home screen: Changing the phone status bar You can also change how the phone's status bar is displayed with a meta tag. The values for content are default, black and black-translucent. Preventing scaling If you pinch on a web app, it still responds like it's in a browser and zooms in. You'll almost certainly want to set the viewport width to the device width as well, so that the app shows up at its natural resolution. Preventing elastic scrolling Confused?

Turning InDesign Files to iPad Apps Turning InDesign Files to iPad Apps by: David Blatner | January 14, 2011 I’ll be speaking at Macworld Expo (San Francisco) in a couple of weeks on the topic of converting InDesign files to the iPad. So I’ve been exploring the various options available. Using InDesign Some solutions let you add interactive features directly within InDesign, and then export a file that can be converted into an iPad iApp. Adobe’s Digital Publishing Solution (DPS): This used to be called the “digital magazine publishing solution” (DMP), but fortunately someone at Adobe came to their senses and realized that it’s useful for more than just magazines. Convert PDF files to iApps Other solutions take a different approach: You export a PDF file from InDesign (or any other application, I guess), then upload that, add interactivity using their proprietary solution (usually through a web browser) and then they convert the file to an iApp for you (or, in some cases, force you to use their app). Other suggestions?

Tracking Touch Events on the iPad « The HTML Pad February 12, 2010 by thethirdamigo 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. 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; } I have created a full working example with source here. Like this: Like Loading...

How to make a magazine app in iOS – Part II Welcome to the second part of this tutorial. Previous in the series:How to make a magazine app in iOS – Part I The iOS5 revolution A lot of water has flowed under the bridge since our first part of this tutorial. I will not spend my time explaining all the Newsstand features, all in all we’re creating a magazine app here and the Newsstand implementation details go beyond our original purposes. The example app The screenshot shows the final appearance of the app. The full app code is available on GitHub. I have setup this app using the basic single window Xcode template and then added the two main components in the application delegate startup method: The two components are: the Store class, which represents the Store Manager block in the app architecture; this Class is a subclass of NSObject and is not linked to the user interface.the ShelfViewController represents the UI of the application. The app has then been integrated with the new Newsstand requirements in the info plist. Conclusions

iScroll 4 Project info Last code update: 2012.07.14 – v4.2Device compatibility: iPhone/Ipod touch >=3.1.1, iPad >=3.2, Android >=1.6, Desktop Webkit, Firefox, Opera desktop/mobile.Discussion groupQR Code opens demo page. Support development If this script saved your day and you wish to support future developments you may consider sending some funds via PayPal or Flattr. Overview iScroll 4 is a complete rewrite of the original iScroll code. While latest Android revisions are supporting this functionality (although support is not optimal), Apple seems reluctant to add one finger scrolling to divs. In addition to all previous iScroll features, version 4 introduces: Pinch / ZoomPull up/down to refreshImproved speed and momentumSnap to elementCustomizable scrollbars Please note that iScroll 4 is not a drop-in replacement for iScroll 3. Also consider that the script is still in beta, and some APIs may slightly change. Getting started In the archive you’ll find plenty of examples to get you started. onLoad

Mobile HTML5 Framework - Features of Sencha Touch | Features | Sencha Touch Built on HTML5 Technology Sencha Touch, a high-performance HTML5 mobile application framework, is the cornerstone of the Sencha HTML5 platform. Built for enabling world-class user experiences, Sencha Touch is the only framework that enables developers to build fast and impressive apps that work on iOS, Android, BlackBerry, Windows Phone, and more. Smoother Scrolling and Animations Sencha Touch provides a user experience unparalleled in HTML5. Adaptive Layouts Sencha Touch’s novel layout engine leverages HTML5 in powerful ways to let developers build complex applications that respond, load, and layout in a snap. Native Packaging Web applications work everywhere.

Luxembourg, Centre d'affaire, Domiciliation, Création de société, Immatriculation, Secretariat, Comptabilité, Services VIP Touch - JavaScript Mobile Framework for Building HTML5 Web Apps DHTMLX Touch is a free open source JavaScript library for building HTML5-based mobile web apps. It's not just a set of UI widgets, but a complete framework that allows you to create eye-catching, robust web applications that run on iOS, Android, and other mobile platforms. Syntax DHTMLX Touch framework offers intuitive object inheritance. Extendable Functionality DHTMLX Touch provides an elegant and simple solution to extend and customize the existing functionality of the library and to add new UI components. Data Storage on the Client Side Global data storage is an advanced and useful feature that allows keeping relations between data elements (e.g. list of employees and employee details form) on the client side. This feature provides automatical update of data across UI elements without user intersection. Server-Side Support Server side of DHTMLX Touch framework is based on dhtmlxConnectors (the same that used for DHTMLX Ajax library). Development Tools Components and Controls Compatibility

BreakTime – You need a break Joshfire framework

Related: