LavaLamp for jQuery lovers!
Hover above and feel for yourself, the nifty effect of Lava Lamp. What you just experienced is nothing but the LavaLamp menu packaged as a plugin for the amazing jQuery javascript library. I personally believe that the effect rivals that of flash – Don’t you? Especially considering the fact that it is extremely light weight. Just so you know, it weighs just 700 bytes(minified)! Often I have noticed, that the credits are usually granted towards the end.
Animate Panning Slideshow with jQuery
If there’s one thing that never seems to go out of style, it’s a good jQuery slideshow. Highly visual websites rely on the ability to showcase imagery automatically. Whether it be a professional photographer or zoo, slideshows pop up so frequently because they work well. In today’s tutorial we’ll take the makings of a classic slideshow, but use a different kind of transition to animate between slides.
About Interaction
The field of Interaction Design is relatively new compared to other well-established fields like maths or physics. Although quantitative research in the field has made it more science-like, we can hardly say it is pure science. Experiments in science should be reproducible and theorems in science can be strictly proved, but this is hardly realised in user research. IxD – An unmatured field Another manifestation of an new or un-matured field is that people use different terms to refer to the same thing. In the field of interaction design, people actually speak different dialects of jargons.
Using jQuery for Background Image Animations
After reading Dave Shea's article on CSS Sprites using jQuery to produce animation effects, I felt like playing around with things to see what could be done but accomplish it with a simpler HTML structure (no need for adding superfluous tags) and simpler code, too. Changing the position of the background image felt to be the best approach to creating the type of effect we're looking for (and I'm not the first to think so: see the examples at the end of this article). jQuery is a great library for this type of task but out of the box, it can't animate background position properly because of the need to animate two values instead of just one (too bad not all browsers implemented the non-standard background-position-x and -y like Internet Explorer). You'll have to use the Background-Position plugin that is linked in the demo (the original plugin is no longer available on the jQuery site). Previous versions didn't support negative or decimal values properly.
How to Create a Simple iTunes-like Slider
When space is at a premium, making use of sliders is the optimal way to present information. Today, we'll take a look at how to create a slider similar to the one used in the iTunes store. Developers often seek the functionality provided by sliders in order to fit lots of information in the space provided. But creating such a slider is not as difficult as you might think. With a little planning and some experimenting, you can create one rather quickly. I believe a demo is worth a thousand words.
How to create jQuery Parallax Scrolling Effect with 15 Tutorials
Modern templates have many parallax scrolling effect built into them for appealing user interaction and to make sure users find the real call to action sometimes. Most of the time parallax scrolling goes beyond tolerable levels as most people hate to scroll longer than normal levels. Making sure and keeping parallax effects to jaw dropping and tolerable level is what you must learn eventually.
Perfect Dropdown Login Box like Twitter using jQuery
Twitter’s running a new homepage with clean and easy design. Look at the top right of Twitter’s homepage, you’ll see the sign in button which will drop down the login form. Today, I will make an entry to show you how to create a login drop down with Twitter style using jQuery. It’s really easy, it’ll help you save the space of your webpage and make visitors feel comfortable by the awesome toggle login form.
10 Fresh jQuery Plugins and Tutorials
The popularity of jQuery continues to grow. This means that we’re seeing it used on more websites these days, and there are more developers coming up with new ways to use it. The great thing about that is many of these developers are sharing what they learn though tutorials and plugins.
Welcome to Jarallax.com
What is jarallax?Web based parallax scrolling and much more! Jarallax is an open-source javascript library which makes adjusting css based on interaction easy.With Jarallax it's easy to create a parallax scrolling website.
Sliding Boxes and Captions with jQuery
Add an extra layer of information to your images with sliding boxes. This is now a plugin! Check out the announcement post for the Mosaic jQuery plugin. Check the project page for the latest release notes and features!
Lights Out – Dimming/Covering Background Content with jQuery
This is a quick and easy approach that tackles a pretty common technique. By the end of this tutorial you will be able to add pop up message boxes complete with dimmed background to your existing site. Feel free to take a look at the demo to scope out exactly what we’ll be creating here today. You may already be familiar with Lightbox – which does a number of the things we are aiming to accomplish today, so as an added disclaimer – The purpose of this tutorial is simply to show you how to dim/cover the background while displaying a message box. The Concept Here’s the gist: When a link is clicked a div that covers the entire page becomes visible and lays on top of the content.
New images on Wookmark
Log in Help Fresh on Wookmark Wookmark is a place for creativity.You should join us. Sign up
Nate Armagost - Web Developer
As of the new version 2.1.0, zAccordion will not be tested in Internet Explorer 6 or Internet Explorer 7. zAccordion is supported in Internet Explorer 8 and the latest builds of Firefox, Chrome, and Safari. Version 2.1.0 — September 26, 2012 Added a destroyComplete option that is available after the accordion is destroyed. Renamed afterBuild to buildComplete to align with naming conventions. Fixed a small display issue with list-items inheriting a text-indent property.
Video - Dive Into HTML5
You are here: Home ‣ Dive Into HTML5 ‣ Diving In nyone who has visited YouTube.com in the past four years knows that you can embed video in a web page.
