25 Code Snippets for Web Designers (Part3)
April 12, 2007 by Oli · 30 Comments 
Part 3 of our code snippets series takes a look at more handy pieces of html, ajax and css that you can incorporate into your web designs. If you missed them, check out part one and part two as well.
53 CSS Techniques – Great roundup from our friends at Smashing Magazine
Accessible Map Rollovers – Create points on a map with roll-over boxes
Styling Horizontal Rules – Even though it’s sometimes recommended to replace the <hr> element with cascading stylesheets only using horizontal borders of other elements, I prefer <hr> as a section divider
Cross Browser Multi-Page Photograph Gallery - Hover over the tabs to display a page of images. Hover over each image to see a 2x image and finally, on the Portraits and Landscapes, click the image to open a new window showing the 640 x 480 pixel version
CSS Button – Create a button using only css
CSS + Javascript Fancy Menu – In this article I’ll go through the creation of a custom navigation bar with some cute Javascript effects that will certainly impress your friends
CSS Image Wrap – Image text wrap with sandbag divs
CSS Cross Fader – In this particular demo, I am going to show how to build a browser-agnostic crossfading effect using Script.aculo.us, a Javascript effects library
CSS Bar Graphs – Create complex Bar graphs using css only
Attach icons to anything using CSS – Thanks to CSS selectors it’s possible to attach icons to anything you want just by adding an attribute of your choosing to your HTML
HTML Visual Sitemap Tool – If you’ve ever had to produce a sitemap for a client using tools like Visio or OmniGraffle, you know that it can be tedious to visually organize a complex hierarchy of pages. Having experienced this myself, I developed a simple and efficient way to make a sitemap through the benefits of standards-based HTML and CSS
Digg comment style sliding divs – How to make sliding DIVs using Javascript and CSS from scratch without having the overhead of Effects libraries such as script.aculo.us
Ajax Auto Completion Demo
Thumbnail Images – Suppose you have a series of images in thumbnail and you would like the user to easily browse through them. In this script we will create three thumbnail images and a larger copy of the selected image will be displayed on the right of the screen. We will also highlight the currently selected thumbnail
. 
Sliding Photograph Galleries – This gallery is my simplest yet. It is just an unordered list of images that are normally compressed vertically (reduction 8:1). When you hover over one of these compressed images it expands to full size
Free CSS Menus – Downloadable examples of css-based navigation menus
Image Fade – Fade an image in using only CSS
Time Sensitive Style Switcher – You Can Change Styles Based on Time of Day
Free Web 2.0 Templates – Download free xhtml / CSS templates
Turn lists into Trees – In this article, I will present a technique to display a multi-level unordered list in the form of a tree with lines connecting nodes
Custom Bullets – Use css to style list items with custom bullet points
HTML Text Drop Shadows – The drop shadow may not be a designer’s most important tool, but on occasion the need arises to add some punch to a headline. One example could be for branding text that is positioned on top of an image; Depending on the colors of the image, your text might get lost without a shadow to pop it out
CSS Dashboard effect – Ever want to alert your users to a really important message?
Create flickr-like Editing Fields Using AJAX & CSS - On one of my web projects I’ve been working on, we needed to allow the user to edit some information on their profile page. I could have written an HTML form page and then written the php database updater, but why use such outdated interfaces?
Form field hints with CSS and JavaScript – As you tab through each input field, some helper text appears in box out to the right
Blogs are the invention of web 2.0 and are becoming rapidly popular on internet. One can find latest information along valuable comments on them. As any web hosting blog provides the latest information on hosting along its advancements where as one can also have enough knowledge about control panel as well as the education about pc backup through them. A person having enough knowledge of internet marketing advertising can easily start home business. While one can find the business of text-link advertising another profitable home based business. Blogs too provide information about online courses like MCSE training and many other while teaches as well how to get online certificate.
Great list, just one more and we have 100 great resources
Thanks!
Thanks – Ill get working on the 100 next week
nice list. thankz
You are so great… Thanks again!
Thanks a lot I really needed the digg style sliding =)
Thanks… nice collection…
Thanks for taking the time to put all this code on one page. Very useful.
About the mentionned CSS image wrap: be sure to check http://www.theboxoffice.be/ which lets you automatically generate the sandbag divs
thanks
very good list, some stuff I had seen before some new. I will be sure to come back later when I need something interesting…
Hi,
thanks for the great list,
got some good ideas.
thanks
Fergal.
Hey if you want more check here they are: http://www.enricoromita.it/prv-stuff.rar
Wonderful tips. I’m going to see if i can use it for my site MUSICSHEDD.com
again a very helpful list of resources.
Hi My Name Is ivamgv.
Hello! Good Site! Thanks you! cylbajxryfs
Thanks for taking the time to put all this code on one page. Very useful.