Related Posts Slide Out Boxes by Codrops
Today is an unusual fine late summer day, sun from a clear blue sky and warmth in the air – what could be better to do than to close myself into a hot and dark room and write a roundup of the latest jQuery techniques. For us, this term (jQuery techniques) includes tutorials, plugins and similar, and with “new” we mean released or updated during actual period – and this listing involve the period of July 1, 2010 until August 19, 2010.
Cashrevelations.com presents a selection of new and fresh jQuery techniques – 12 brand new jQuery techniques released or updated during the period of July 1, 2010 until August 19, 2010. All these jQuery techniques are presented with demo.
You might also be interested of: 150 JavaScript Techniques
12 New jQuery Techniques – August 2010
1. Slide Down Box Menu – jQuery & CSS3
In this tutorial you will learn how to create a cool and unique sliding box navigation (with submenu box with further links). The main idea is to make a box with the menu item slide out, while a thumbnail pops up in the top of the menu.
View Demo
2. Custom YouTube Video Player – jQuery
In this tutorial you will create a jQuery plugin which uses YouTube’s chromeless player, and creates our own set of minimalistic controls. The supported controls include a Play, Pause and Replay button – and also a clickable progress bar.
View Demo
3. Exposure – jQuery Image Gallery Plugin
Exposure is a jQuery plugin for rich and smart photo viewing that can handle very large amounts of photos and has flexible configuration that allows custom transition effects and similar – and also smart image preloading and support for photo meta data.
View Demo
4. Related Posts Slide Out Boxes – jQuery & CSS3
In this tutorial you are going to learn how to create a little widget that can be used to show related posts in any page. When the visitor hovers over the items, they slide out, revealing the title and two links, one for the related article itself and one for the demo.
View Demo
5. AD Gallery – jQuery Plugin
A highly customizable image gallery plugin with a list of thumbnails below the image. Not quite like Lightbox or Thickbox, but more of a showcase type of gallery. First released in 2009 and updated on July 15, 2010. Demo on the download page.
View Demo
6. Colortip Tooltip Plugin – jQuery
In this tutorial you will learn how to write a simple jQuery tooltip plugin. The plugin is going to convert the title attributes of elements withing your web page, into a series of colorful and stylish tooltips. Six different color themes are available.
View Demo
7. Blockster Transition Effect – jQuery
Blockster is a transition effect designed for ‘featured content’ rotators or slideshows. Its underlying concept is to transition between one element to the next block by block – and it is highly customizable. Demos are located on the download page.
View Demo
8. Dynamic FAQ Section – jQuery & YQL & Google Docs
In this tutorial you will learn how to create dynamic FAQ section – with the help of jQuery and YQL, which pull the contents of a shared spreadsheet in your Google Docs, and use the data to populate your FAQ section with questions and answers.
View Demo
9. Image Highlighting & Preview – jQuery
In this tutorial you will learn how to highlight and preview images that are integrated in an article or spread over a page. The images are highlighted on a delayed hover and offer a preview mode which will enlarge and center the bigger version of the image.
View Demo
10. POI Map – jQuery & Google Maps
In this tutorial by Bogdan Pop from WebRaptor you will learn how to build a useful (when you urgently need to present important locations to your visitors) but fairly simple POI map with jQuery, Google maps and some not so complicated CSS.
View Demo
11. Collapser – jQuery Plugin
JQuery Collapser is a very light-weight multi purpose collapser plugin made for expanding and collapsing elements, and it can collapse any element within a document. It can also create accordions and more by adding a single additional line.
View Demo
12. Thumbnails Navigation Gallery – jQuery
In this tutorial you are going to create an extraordinary gallery with scrollable thumbnails that slide out from a navigation. The idea is to have a menu of albums where each item will reveal a horizontal bar with thumbnails when clicked.
View Demo
The different jQuery items presented here in this article are not in any particular order – and Cashrevelations.com is for the moment not affiliated with any of the authors.





[...] 12 New & Useful jQuery Techniques [...]
[...] 12 New & Useful jQuery Techniques [...]
[...] This post was mentioned on Twitter by JustJenFelice, Tommy Olovsson. Tommy Olovsson said: 12 New & Useful jQuery Techniques – http://bit.ly/bfyUkT #jQuery #JavaScript #webdesign [...]