Design Lunatic

Isotope infinite scroll

The faster something loads, the happier the user is. This is something it is important to understand when creating websites. Today, I’ll show how to use jQuery’s AJAX capabilities in conjunction with isotope.js to dynamically load content in once the user reaches the bottom of the page, which makes everything seem faster and improves the user experience.

Custom Scrollbars with jQuery

Sometimes, as web designers, we create a perfect design. Everything is exactly the way it should be, every pixel in the right spot, every color the right tinge. However, there is one thing that we often leave unchanged, and that is the scrollbar. Today, I’ll show how to create custom scrollbars using jQuery.

Awesome jQuery Tooltips

Tooltips are a great way to display some information about an element on the page. Normally, these are used on links. In this post, I’ll explain how to create a jQuery script that allows for easy tooltips on a page.

Rearrange content when it’s too wide with jquery

Media queries have proven to be extremely useful in responsive layouts. However, they do have a drawback: they can’t analyze the content on the page before deciding when to kick in. In this post, I’ll show how javascript can be used to make layouts even smarter and more adaptable.

A Continuation of the Isotope Tutorial: Hash History with Isotope

Isotope is great, but what if the user refreshes the page? Or decides that what the content was previously filtered by worked better, and presses the back button? Then, problems begin. Today’s post aims to solve that problem by using a plugin called jQuery hashchange event.

A Continuation of the Isotope Tutorial: Combination Filters

Isotope.js is a powerful tool for creating dynamic webpages with interactive capabilities. It does this by using “filtering”, by which certain elements on the page are removed or added, depending on what the user requests. This by itself is incredibly useful, but it can be made even better, by using combination filters. This allows the user to select two criteria by which content is filtered. In this tutorial, I’ll show how to do just that.

Create An Image Gallery With CSS3 3D Transforms

CSS3 offers many exciting new opportunities for web designers looking to spice up their webpages, but one of the most interesting ones are the 3D transforms. Objects on the page can be manipulated in 3D space. In this tutorial, we’ll make an image gallery that utilizes 3D transforms to make things a bit more interesting.

A Continuation of the Isotope Tutorial: Highlight the currently active link

In web design, the navigation bar is crucial in telling the user where he is located. Usually, the user is further helped out by highlighting the currently active menu item. Unfortunately, if the site uses Isotope.js, the user won’t know what is currently being displayed. In this post, I’ll show how that can be fixed so that the user can have an excellent experience even on a site using Isotope.

Jquery Lavalamp Menu with Keyboard Control

Today, I will explain how to create a jquery lavalamp menu. However, this is more than just a simple lavalamp menu; it will also have keyboard navigation. Sound interesting? Let’s get started!

Swipe Gestures With Jquery

In this tutorial, I will explain how to create swipe gestures in Jquery, and use these gestures to create a simple image gallery.

Older Posts