Tag Archives: javascript
Mobile device emulator as Chrome Browser extension
If you are a mobile application developer, then it would have been always a quest to find the devices to test the applications. Apart from that, one need particular environments to develop the application too. Some device applications can be developed and tested in particular Operating system. Then there are HTML5 and JS frameworks and tool kits to develop mobile applications. These frameworks and toolkits allow one to develop applications as web applications. While this option, opens up the opportunity to develop mobile applications in any environment, there is still a lot of work to do, when it comes to test these applications in various mobile devices.
Ripple is an extension to Chrome browser. I think this can not be more easier than this. Once installed, the interface is quite straight forward. Well the process goes like this. If you are in a webpage (any webpage), just right click and say
Emulator > Enable
That will render the webpage in a mobile device, there are choices to configure the devices also. That means, any web application can be tested with a number of device emulators, right in the browser itself. There are options for Device, Platform, Accelerometer along with a lot more.
I think this can not get easier than this.
Getting into web design action
Once we are familiar with the key concepts of the web, browser and how it works, now its time to see how to get started with it. If you have not yet gone through them, here are the links,
1. introduction
2. getting used to the terms
I hope by now you have gone through the above links. This is not mandatory, but then going through them will bring you to the same page with me. Else it will be a little difficult for any one to understand what is being referred in the tutorial here.
Well, lets get into action. By now, you must be knowing to start with a web-page we at least need 3 files (Not mandatory but good way to segregate different functionality in different files, refer to the “getting used to the terms” reference for more on this ). So the 3 files are, one HTML file, one Javascript file and one CSS file. We will start to put the basic code for these.
The HTML file is stored with an extension of “.html”, CSS files are stored as “.css” and javascript files are stored as “.js” files. Lets write our first html file.
The very basic HTML page code will look something like
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
javascript library for converting SWFs to HTML/CSS3
When HTML and CSS3 are really catching up, its the animations which need a way to go to the web without flash plugin. Fortunately we have some very promising javascript libraries out there which does this. The two must mention libraries are
Gordon : http://github.com/tobeytailor/gordon/wiki
Smoke Screen : http://smokescreen.us/
While Adobe showed a tool on this years MAX, 2 days back, which converts FLA animations to HTML5/CSS3, its time to wait and watch, when people will have access to the tool.