- then (midway down) ... http://www.1stwebdesigner.com/tutorials/incredible-apple-webdesign-style-coding-tutorials/
How to create the Apple.com navigation bar
- How to create the graphics for the bar: http://www.pscloud.com/web-design/apple-navigation-bar/
- How to create a more advanced version of the Apple.com bar
- (demo) http://www.kriesi.at/wp-content/extra_data/kwicks_tutorial/kwicks_final.html
- (code) http://www.kriesi.at/archives/apple-menu-improved-with-jquery
- Deconstructing the Apple.com navigation bar – http://decaflon.com/apple/notes/4422/ (discussion)
Create Apple.com slide out drawers
- Code and example http://jqueryfordesigners.com/slide-out-and-drawer-effect/
- Apple.com slide out drawers sidebar for WordPress http://nettuts.com/javascript-ajax/wordpress-sidebar-turned-apple-flashy-using-jquery-ui/
Add Apple.com style search suggestion to your site.
http://www.marcofolio.net/webdesign/a_fancy_apple.com-style_search_suggestion.html
Make an Apple.com style product display widget
- http://blarnee.com/idisplay (prototype UI)
- http://jqueryfordesigners.com/demo/slider-gallery.html (jQuery)
Apple.com CoverFlow
- (with mootools) http://www.outcut.de/MooFlow/example-ajax.html
- (in prototype) http://mediaeventservices.com/demo/gallery/gallery.html
- (in flash) http://www.yaelle.com/?p=61
Related posts:
- 22 Excellent Examples of Advanced jQuery UI's in action jQuery is one of the most widely adopted javascript...
- 20 New examples of advanced jQuery UI’s in action. jQuery has been one of the most widely adopted...
- Jailbreak your Apple iPhone or iTouch with one click [May 29th updated] UPDATE: If you’ve got a new iPod or iPhone...
- How to create impressive animations in jQuery with .animate() I’ve been asked many times over the past month...
- How to create animated Skype-style buttons using jQuery Hey guys. If you’re a frequent user of Skype I’m...
Related posts brought to you by Yet Another Related Posts Plugin.
------------------
http://www.1stwebdesigner.com/tutorials/incredible-apple-webdesign-style-coding-tutorials/
------------------
15 Incredible Apple Webdesign Style Coding Tutorials
Apple style is very popular trend in our days – their design and style is really unique, clean and always good-looking. No wonder there are many designers trying to understand that style, why it works and how. There also a bunch of advanced coding tutorials available out there. Since I am Apple website style fan myself, I did research and showcased several amazing coding tutorials I found in the Internet.
I thought I will find more, but I guess Photoshop Apple tutorials are a lot more popular now than coding tutorials. But I hope you will enjoy this article as well – it’s short, but really quality one!
1. A Beautiful Apple-style Slideshow Gallery With CSS & jQuery
Here you’ll be making an Apple-like slideshow gallery, similar to the one they use on their website to showcase their products. It will be entirely front-end based, no PHP or databases required.
2. Apple style Accordion Menu
This tutorial will walk through how to create your own simple plugin, and then replicate the Apple downloads drawers using the very excellent Accordion plugin.
3. How to: Recreate apple.com menubar
Apple.com menubar is really an exemple in terms of clean, semantic code and very cool design. In this tutorial, you will recreate Apple’s website navigation bar and study the techniques used.
4. Leopard Desktop with jQuery using jqDock
In this tutorial you’ll learn how to use jQuery to create a completely coded Dashboard, just like Leopard! This can be handy in hiding a whole lot of gadgets or widgets you don’t have space for!
5. Create apple.com-like breadcrumb using simple CSS
In this great tutorial you will recreate http://store.apple.com/ type menu navigation.
6. Create an Apple Inspired Flash Preloader
In this tutorial you’ll create an Apple inspired preloader MovieClip and lrearn how to display some loading information. All this using Flash and ActionScript 3.0.
7. Create an apple style menu and improve it via jQuery
In this tutorial you will create Apple-flavored Leopard-text-indent style from Photoshop to coding it with jQuery.
8. A fancy Apple.com-style search suggestion
In this tutorial author will be trying to recreate the effect from that website by creating a fancy apple.com-style search suggestion.
9. The iPhone unlock screen in xHTML, CSS and jQuery
10. How To: Recreate the Apple Product Slider with JQuery
Stylishly capitalize on limited space with a side scrolling image gallery, similar to the one that Apple uses to show off their products.
11. Fixed Floating Elements
Learn how to create floating comment form like apple shopping basket.
No comments:
Post a Comment