Tuts
Get flash to fully experience Pearltrees
Slide Down Box Menu with jQuery and CSS3 | Codrops
In this tutorial we will create a unique sliding box navigation. The idea is to make a box with the menu item slide out, while a thumbnail pops up. We will also include a submenu box with further links for some of the menu items. The submenu will slide to the left ... View demo Download source
Subtle CSS3 Typography that you’d Swear was Made in Photoshop | Nettuts+
Thanks to text shadows, outlines, transitions, and even text gradients, we can now create cool typography that you’d swear had to be made with a program like Photoshop. Nope, all CSS3 baby! Let’s take a look in this video quick tip. -webkit-mask-image: -webkit-gradient(linear, left top , left bottom bottom , from(rgba(0,0,0,1)), color -stop(50%, rgba(0,0,0,0)), to(rgba(0,0,0,1)));
Vertical Sliding Info Panel With jQuery
This is an example of simple page that's centered and has a vertical sliding panel on the far left (try it! click on the 'infos' tab that's on the left!). We used jQuery to create this sliding panel (and CSS3 rounded corners because it looks cool)
50 Useful Coding Techniques (CSS Layouts, Visual Effects and Forms) - Smashing Magazine
Although CSS is generally considered a simple and straightforward language, sometimes it requires creativity, skill and a bit of experimentation. The good news is that designers and developers worldwide often face similar problems and choose to share their insights and workarounds with the wider community. This is where we come in.
3 Use CSS3 to Create a Dynamic Stack of Index Cards 4 We will create a dynamic stack of index cards solely with HTML and CSS3 and use such CSS3 features as transform and transition (for the dynamic effects) and @font-face, box-shadow and border-radius (for the styling). 5 dynamic PNG shadow position & opacity
50 Brilliant CSS3/JavaScript Coding Techniques - Smashing Magazine
Brian Cherne's Porfolio
Welcome to my portfolio. This is not a showcase of *all* the work I've ever done -- the list below is a subset of the projects and clients I've worked with. Please contact me if you have questions. brian@cherne.net YourReebok (née RbkCustom) is a Flash-based, shoe configurator that Fluid built in 2005 and has maintained since.Neato Options Now, of course you want some other cool features like HTML captions, bullet navigation (now with thumbnails as well), or using content instead of images. Let's give you the low-down on how to get these going.
Interaction Design and Design Strategy
Accordions can be very useful for showing lots of different sections of data in a small amount of space. jQuery UI has a built in Accordion function , but according to the jQuery UI Build your Download , the size of the Core jQuery UI and Accordion scripts are 25kb and 16.6kb, respectively. Today, I’ll show you how to build a custom accordion that is more “bandwidth efficient”. That seems like a lot for just one simple accordion. Especially when you add in the normal jQuery script, which is 18kb minified and Gzipped. So instead of increasing your page load time with the extra unneeded functionality, why not create something from scratch?
Exactly How to Create a Custom jQuery Accordion | Nettuts+
Quick Tip: Working with the Official jQuery Templating Plugin | Nettuts+
Thanks to Peter Galiba (see comments), for recommending the more elegant $.map solution, shown above. Refer to the screencast for a full walk-through of the code above. Most importantly, though, is that we're creating an array of objects. This will then serve as the data for the the template that we created in step two.If you pile on hour after hour in front of a screen, maybe you should take the time to make sure you’re as comfortable as you could possibly be – which is where ergonomics comes in. How are you going to make the perfect elevator pitch for your article? Hold on a second, take some deep cleansing breathes, let’s take a look at some ways to make titles really grab the attention of your audience. Don’t get hung up on a dull design, before jumping ship take a minute to get versed in how to add some extra flair. Crisp, impressive designs, guaranteed.
Five Minute Upgrade | Build Internet!
Nivo Slider - The Most Awesome jQuery Image Slider
Want unlimited use of the WordPress plugin for your clients sites? Are you a premium theme developer and want to package the WordPress plugin with your themes? Get all this and much more with the Developer package.20 Websites To Help You Learn and Master CSS
CSS can be both a tricky and easy to learn. The syntax itself is easy, but some concepts can be difficult to understand. This article features 20 excellent websites to help you "grok" CSS. There’s a wide range of websites included – from blogs to directory-style lists and websites that focus on one particular topic related to CSS. A List Apart, the premier site to read articles about web design and best practices, has a collection of articles on the topic of CSS dating back to 1999.In today’s tutorial, we’ll embark on a typical photo excursion, but we’ll be limiting ourselves by only using one lens. We’ll be forced to master all the characteristics of a wide angle lens in order to be productive. But not to worry, our professional guide, Simon Plant, will be there to help!
Tuts+ Network
Last year we posted on Abduzeedo a very cool post about typographic portraits, the 45 Amazing Type Faces - Typographic Portraits became one of the most popular posts on Abduzeedo, and a lot of people asked me how to create that effect in Photoshop. We have also posted a little tutorial showing how to do that using, Flash Photoshop Quick Tips #5 - Typographic Portrait , however I decided to create a nice typographic effect using just Photoshop. So in this tutorial I will show you how to create a really cool and super easy typographic portrait in Photoshop. We will use the Displace filter and some Blend Modes to achieve the effect. The whole process is quite simple but it might take you some time to add the texts and elements, but once you do that the rest is very straight forward.