Time for another jQuery Quicktip. This time, the fade function. I’ve been having to use the fade function on a site recently, so i thought i’d share a quick tip.
Like most of jQuery, it’s pretty simple to apple the fade function to an element.
First of all we wait for the DOM to be ready, this should be familiar:
$(document).ready(function(){
});
Now we’ve done that we use the built in fade function to fade the element up; $("#picture_holder").fadeTo("slow", 1.0);
});
We’ve used the example with an id of “#picture_holder” in this example. The first property in the brackets after the the fadeTo function is the speed of the fade, here you can use the term slow or fast or alternatively use a number (remember to remove the ” ” around the slow text) the second property is the opacity of what it is going to fade to, in this case 1.0 is an opacity of 100%, with 0.5 being 50% percent and so forth.
If you want to fade an element in from load then you need to set its opacity before hand. This is easy to do in jQuery too:
$('#picture_holder').css('opacity', 0);
This sets the “#picture_holder” to have an opacity of 0%. We put this before the the fade statement and the the opacity will fade from 0% to 100% .
Motion Design Love is a new blog by myself. It is a blog dedicated to loving and showcasing the best that Motion Design and Graphics have on offer, and will hopefully feature some tutorials by myself too. The design of Motion Design Love is only temporary whilst i finish off the rest of the new design for it.
It’s been a while since i last wrote a blog! It’s been a hectic few months with lots going on but i thought it was about time to write another post. One of the things i’ve been working on is a new Motion Graphics/Motion Design blog call Motion Design Love.
Motion Design Love
I’ve set the blog up so i can write and show some of the best bits of motion design, as well as writing tutorials and any other motion graphics news too. Go check it out, drop a comment, maybe even submit your own piece (when i’ve implemented that feature! :p). I’m using a temporary theme on there at the moment whilst i iron out some of the details on the official theme, so it’ll be changing in the future but at least it looks decent now though!
I’m going to start blogging more regularly on here as well, hopefully it’ll be once a week. At least that’s what i’m aiming for!
Occassionly, there’s some music videos that you see that make you think, wow, i’m jealous, i wish i’d made that video! Well here’s a selection of some videos that make me think that! Enjoy!