Gaya Design » css

QueryLoader2 – Preload your images with ease

Gaya — Wed, 26 Oct 2011 20:10:38 +0000

Gaya Design is back in business and hitting hard with a redo of the 2009 script QueryLoader. I kept getting e-mails and comments about it and thought I had left it just hanging there for way too long. It had become very outdated. So here it is: version 2 of QueryLoader!

Text with Moving Backgrounds with jQuery

Gaya — Fri, 08 Jan 2010 18:19:25 +0000

Personally, I am a huge fan of negative space in design. This got me thinking while I was trying to accomplish something different. Normally a textual caption would be positioned above a background, but I wanted to do it the other way around: place the background in the letters. I also wanted to add some nice dynamic effects to enhance the effect. This was amazingly easy to accomplish in jQuery with the use of a little creativity. This article will explain what you need to do create an effect like this yourself.

How to start writing your own sweet jQuery scripts

Gaya — Mon, 30 Nov 2009 18:15:10 +0000

Sometimes it can be hard to start writing a Javascript script when you don't know what to do instantaneously. But luckily there is the Internet right? Just go to Google and type in what you want in a script. Good chance some jQuery or Javascript solution will show in the results, and you are basically done. The problem is that you still don't know how to do such things. In this article I'll discuss the viral points of planning out a Javascript / jQuery script with ease.

QueryLoader – preload your website in style

Gaya — Thu, 01 Oct 2009 11:43:28 +0000

There is always a minor problem when it comes to preloading image on a website. Nobody really has a full solution for it. There are a lot of preloaders available, but most of the time they only display the words: "Loading page" or have an animated image that spins. Why can't there be a nice loading bar of some kind? I've gotten a few request on how to make a preloader, or people asking me how to get all the images of a web page and preload them (even the images in CSS). This preloader has it all. Loading bar, custom animations and getting all images included in the web page.

There is a new version of QueryLoader. Consider this one obselete!

jQuery convertion: Panoramic Photoviewer in Javascript

Gaya — Thu, 09 Apr 2009 19:24:27 +0000

This is part two of my script convertions. From scriptaculous to jQuery in just a few minutes of work. This time it's the Panoramic Photoviewer to get a jQuery makeover. A few highlights: From 200 to 80 lines of code (wow). Works in more browsers. Lightweight due to jQuery usage. For all the jQuery lovers: Here is the Panoramic Photoviewer. Now in jQuery!

jQuery convertion: Garagedoor effect using Javascript

Gaya — Wed, 08 Apr 2009 18:20:53 +0000

Today I finally found the courage to go and try jQuery. After getting some people say: "You should use jQuery instead of scriptaculous." I began thinking. What is the reason I choose script.aculo.us again? Must have been something I read in that time. Anyway, today I found the time to look at jQuery a bit and thought: Let's convert my very first posted script to jQuery! After 5 minutes of reading about selectors in jQuery and 15 minutes of coding it was born. I am super amazed by the results! About 40%/50% less code and about 200% less time needed to write the script. I bet that in the future 400% less time is reachable! For all the jQuery lovers: Here is the Garage Door effect. Now in jQuery!

Customize the default alert() function of Javascript

Gaya — Wed, 11 Mar 2009 14:41:05 +0000

Web designers, developers and web users know them. We all have run across one of these; the Javascript alert message. Most of the time, I don't even read them and click them away. But the more important thing is that they just look ugly, no matter which browser you use.

So why not remake the whole Javascript alert function? This article will give you the basics of my customization of the alert message.

Panoramic Photoviewer in Javascript

Gaya — Wed, 14 Jan 2009 13:24:46 +0000

As a webdesigner you might have had this problem: "I've got a nice looking wide image, but I don't want my visitors to scroll horizontally." A colleague showed me a new project he was working on. A large image appeared and I had the ability to drag and move the image around in a container. Not super efficient if you ask me, I still had to grab the image and move it around holding my mouse button. Can't there be an easier way? This article will show you my solution to the problem and maybe even a different approach on navigation.

Garagedoor effect using Javascript

Gaya — Sun, 28 Dec 2008 16:00:05 +0000

You might have noticed the menu at the top right corner of the website. That's something what I like to call the GarageDoor effect. Creating one has now been made easy! This tutorial explains everything you need to know on how to create the same effect yourself.