Your favorite Apple, iPhone, iPad, iOS, Jailbreak, and Cydia site.
01-03-2012, 04:25 PM #1
Developer Builds A Virtual iPhone: Pure CSS3, No Images Whatsoever
Here's something you don't see every day.
The CSS3 iPhone 4 features 3 fully functional functions; a working 'slide to unlock' bar that you can click and drag to get onto the home screen. It also has a working power button that you can click on to use, and a working home button that you can click on to use. Unfortunately, that's as far as the fun goes, albeit it's still an amazing concept and breaks the ice for CSS3 creations. The developer recommends that you view the content on Mac OS X with either the latest Apple Safari or the Latest Google Chrome Web Browser applications.
Aside from functions, the CSS3 iPhone 4 also has visual effects. It shows the correct date and time, the correct slide to unlock animations, and the correct SpringBoard animations. So it does hold some truly awesome functionality for being a completely virtual iPhone 4 with absolutely no images. We think that this is a very cool milestone for Web Development.
What do you think about the CSS3 iPhone 4? Share in the comments.
Last edited by Anthony Bouchard; 01-03-2012 at 05:13 PM.
01-03-2012, 04:29 PM #2
Doesn't CSS need image assets? It can't just create different fonts, textures, images out of pure CSS code...can it?
01-03-2012, 04:45 PM #3
01-03-2012, 04:45 PM #4
01-03-2012, 04:46 PM #5
01-03-2012, 04:52 PM #6
Wow, taking a look at the css, this thing is incredible.
01-03-2012, 04:58 PM #7
01-03-2012, 05:07 PM #8
01-03-2012, 05:12 PM #9
CSS3 is very powerful. All you need to do is look at what some of the MMi themers here have been doing with CSS3/HTML5. Some of the widgets and animated lockscreens and wallpapers are clear evidence that flash is going out and HTML5 w/ CSS3 is coming in
CSS3 is capable of even making 3D canvas so what you see in the OP is just the tip of the CSS3/HTML5/Webkit iceberg
01-03-2012, 05:34 PM #10
Another thing is, this could be another platform for mobile OS devices. 3000+ lines of code for a pretty decent virtual clone is nothing compared to the millions of lines of code used for iOS 5.
By the way, CSS3 makes a one size fits all screens. I didn't notice until I decided to try it on my iPhone 4S. When I pinched to zoom, everything focused in and still looked incredibly crisp and colorful.
Last edited by Hillefied; 01-03-2012 at 05:38 PM.
01-03-2012, 05:56 PM #11
Lol, I did this awhile ago.
01-03-2012, 06:03 PM #12
01-03-2012, 07:02 PM #13
Man....I sure wish my iPhone 4 could boot as fast as this virtual one does!! Cool stuffEl Zurdo
01-03-2012, 08:23 PM #14
- Join Date
- Oct 2011
- Thanked 2 Times in 1 Post
How the hell did he create say the signal bar using CSS? Is it even possible without using images
01-04-2012, 12:01 AM #15
01-04-2012, 04:08 AM #16
01-04-2012, 07:19 AM #17
So he created images using css. Very hard work but I am not dumb founded. All images are created using some form of coding.
I do have to say this is very impressive and from the looks of it a lot of hard work has gone into it! Still I don't get the hipe.
01-04-2012, 07:51 AM #18
Using IE8 at work. Looks like an iPhone made for an Atari. Works just as well as one too.
01-04-2012, 02:40 PM #19