Tuts
Get flash to fully experience Pearltrees
Slide Down Box Menu with jQuery and CSS3
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
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.
CSS3 is coming . Although the browser support of CSS 3 is still very limited , many designers across the globe experiment with new powerful features of the language, using graceful degradation for users with older browsers and using the new possibilites of CSS3 for users with modern browsers. That’s a reasonable solution — after all it doesn’t make sense to avoid learning CSS3 (that will be heavily used in the future) only because these features are not supported yet. The point of this article is to give you a glimpse of what will be possible soon and what you will be using soon and provide you with an opportunity to learn about new CSS3 techniques and features. In this post we present 50 useful and powerful CSS3/jQuery-techniques that can strongly improve user experience, improve designer’s workflow and replace dirty old workarounds that we used in Internet Explorer 6 & Co.
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 YourReebokNeato 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
Quick Tip: Working with the Official jQuery Templating Plugin
Just this week, the jQuery team announced that Microsoft’s templating plugin (along with a couple others) is now being officially supported. What this means is that the plugin will now be maintained and updated directly by the core team. In this video tutorial, we’ll review the essentials of the plugin, and why it’s so awesome . As a quick example, we’ll, again, refer to the Twitter search API example from Friday ( think Bieber ).Add a Mobile Landing Page to Your Site Give mobile visitors a way to quickly access your company phone number, email, or just directions to the office. Five Minute Upgrade – Make Your Workstation (More) Ergonomic 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. Five Minute Upgrade – Writing Blog Post Titles That Grab Attention
Five Minute Upgrade | Build Internet!
Typography has long been a large part of graphic, and web design. In the past though, web design has had to suffer typographically, with any text that was wanted in a non web safe font (a font already stored locally on users computers) had to be rendered as an image; not exactly brilliant for the user interface department. Font’s like Lucida Grande, Helvetica and Myriad Pro were as exciting as it got.
6 Killer Text Replacement Tricks to Improve your Typography
Nivo Slider - The Most Awesome jQuery Image Slider
The world’s most awesome jQuery & WordPress Image Slider The Nivo Slider is world renowned as the most beautiful and easy to use slider on the market. The jQuery plugin is completely free and totally open source, and there is literally no better way to make your website look totally stunning. If you don’t believe us, check out the list of features below and you soon will. 16 Beautiful Transition Effects20 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. 1.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.