8 Feb 2011 Ferado

jQuery Default / JavaScript Default Options

This blog is more for myself than any of you readers out there. Every so often I need to have an object of some kind or a function that has its own defaults. Here’s how to do it using jQuery:

[cc lang=”javascript”]

// function
function myFunc(options) {
var defaults = {option1: ‘val’, option2: ‘val2’};
var settings = $.extend({}, defaults, options);
// do something
}

// or, an object
var myObj = {
init: function(options) {
var defaults = {option1: ‘val’, option2: ‘val2’};
var settings = $.extend({}, defaults, options);
}
};

[/cc]

Conclusion

It’s easier to remember how to do things when you practice them. This was my practice at setting JavaScript defaults. See the reference link for more, it’s a good one.

17 Jan 2010 Ferado

20 Amazing jQuery Plugins and 65 Excellent jQuery Resources

If you’re into jQuery, then you need to bookmark this site. It’s amazing! Not only do you get links to some of the great jQuery plugins out there, you also get links to some amazing articles/tutorials on jQuery. Try it out and let me know if you need help with anything.

[source href=”http://speckyboy.com/2008/07/21/20-amazing-jquery-plugins-and-65-excellent-jquery-resources/”]

31 Dec 2009 Ferado

The Best jQuery Lightbox Scripts

I found a site for you that lists some of the best jQuery Lightbox Scripts. If you don’t already know, lightbox scripts are pretty much just javascript files that create modal pop ups. A lightbox can be used to show images, videos, and/or web pages inline without having to open a new browser window.

Keep an eye out for the colorbox, it’s a good one.

[source label=”Visit Source” href=”http://woorkup.com/2009/12/29/jquery-lightbox-scripts/”]

27 Dec 2009 Ferado

jQuery Autosave

No need to click a save button anymore with this jQuery plugin: jQuery Autosave. Seriously, this is something I’ve been wanting and never had the time to develop. Thankfully, these guys/girls created what I’ve been wanting. In this article I’m going to let you know some of the features this plugin offers, how to use it, link you to a demo, and thank you for taking the time out to read what I have to say!

[ad key=”text-inline-small”]

Features

This plugin allows you to send the form when one input or element is changed. You can select something from a select list and send that data using this plugin. You can also override the default actions and create your own custom callbacks. I love callbacks by the way.

How to use it?

Just put the following snippet of code where you put your JavaScript:
[cc lang=”javascript”]
$(‘input’).autosave({ url: ‘/myurl’ });
[/cc]

Demo

The demo on the jQuery Autosave site is great, so I don’t think I need to re-invent the wheel. Please visit: jQuery Autosave and look for the word “demo.” It’s at the top of the page (currently).

Conclusion

Thanks for reading my article. With all the competition out there, I’m glad you came to me. Again, this is a great plugin. You’ve seen me talk about the features, how to use it, and I’ve given you the demo link. I hope you enjoy this plugin.

To download and install jQuery Autosave, please click the following button:

 

[source src=”http://raymond.raw.no/jquery-autosave/”]

24 May 2009 Ferado

Preload your Images with this FREE jQuery plugin!

I like you. I think you’re cool. Thank you for reading my Blog. It’s getting better the more I write. But anyway, enough about us. Let’s talk about how you’re going to use my Image Preloader script. It’s free, do whatever you want with it. Call it your own, whatever, I don’t really care. I like FREE knowledge. I love to compete. I love it when I’ve worked so hard that I can’t think anymore.

I digress.

I wanted to share with you all a way to preload your images with jQuery. If you don’t know what jQuery is, you’re living in the stone age of the web. jQuery makes the average developer look like a Rockstar. I’m not even kidding. Please, read up on jQuery. I’m a firm believer that no site should be built without jQuery at its core.

Now, here’s how you can make yourself an image preloader with jQuery, or well, it’s how you preload your images with jQuery. Okay? We on the same page here?

The code:
[cc lang=”javascript”]
jQuery.preload_images = function() {
for(var i = 0; i < arguments.length; i++) { jQuery("“).attr(“src”, arguments[i]);
}
};
[/cc]

The minified verision:
[cc lang=”javascript”]
jQuery.preload_images=function(){for(var i=0;i“).attr(“src”,arguments[i]);}};
[/cc]

Here’s how you would use it in your code:
1. Include the plugin
2. Place the following snippet in an external file or in between “script” tags:
[cc lang=”javascript”]
$.preload_images(“images/something.gif”, “images/somethingelse.jpg”, “images/etc.png”);
[/cc]

You can also use it to load just one image:

[cc lang=”javascript”]
$.preload_images(“images/something.gif”);
[/cc]

Add as many images as you want to it. However, if you really have to load that many images, you really should re-think your site design. I think preloading your images is a little old school. I only use the preceding code when I’m working with a design already in place or a photo gallery. And usually, with photo galleries, they preload the images anyway. This is more of a nice to have function. I actually put it in my toolbox for rainy days. Why? Because I grew up a boyscout and I like to be prepared.

Don’t worry, you don’t have to copy and paste if you don’t want to. I’ve provided the following downloads for your convenience:

Easy to read version:
DOWNLOAD SOURCE CODE

Minified version:
DOWNLOAD SOURCE CODE