Top 10 User Interaction Enhancing Effects – javascript / css / jquery

1. Highlighting Current Page

Unless you’re using wordpress, most backends don’t come with a way to let you know which page you are on. I scoured the internet for an hour, and found this great javascript solution and it was the only one that worked!
www.richnetapps.com/automatically_highlight_current_page_in/

2. Sliding Panel / Accordion that Degrades Gracefully w/o Javascript

I’m using this for a menu rather than an accordion (you just style it differently. All the other ones I found on the internet stopped working and didn’t even display their info/contents if javascript was turned off! BAD!!!!
Thank heavens for Soh Tanaka:
www.sohtanaka.com/web-design/easy-toggle-jquery-tutorial/

3. Sticky Fixed Scroll for Header / Footer / Sidebar

Seen those sites where an element becomes fixed in place only as you’re scrolling down a page, and then clicks back into place when you go back to the part of the page it originally came from? Hard to describe, but aside from being very cool visually and making a page seem more alive (reminds me of sprinting relay baton pass) – it has several benefits:
-It organizes your page layout to show only what’s necessary at that moment in time
-It doesn’t require you to code any differently, it’s truly an add-on as a finishing touch once code is complete.
-It degrades gracefully when javascript is off, and has no display issues.

Download and see demos here:
github.com/bigspotteddog/ScrollToFixed

4. Accordion

docs.jquery.com/UI/Accordion#overview
demo: http://jqueryui.com/demos/accordion/default.html
Non-ui custom accordion: webdesigncrowd.com/depth-perspective-themed-jquery-accordion/
stackoverflow.com/questions/7403955/very-simple-jquery-accordion-not-this

Running list.. work in progress. TBC!!

Leave a Reply