Question

How can i slide a div in whilst it fades in using jquery. I guess it would need to be offset slightly from the position stipulated within the style sheet.

So for example this div would slide in from the left whilst fading into 100% from 0.

<div id="pageintro">We are a wholly independent</div>

Answer 1

Assuming the element is already hidden / opacity at 0:

$('#pageintro').animate({
    opacity: 1,
    left: '+=100'
}, 1000);

The above example will only work on elements with the ‘left:’ css attribute defined 🙂

Alternatively:

$('#pageintro').animate({
    opacity: 1,
    marginLeft: '+=100'
}, 1000);

This will work on most elements 🙂

They will move the element 100px from the left to the right and from 0 opacity to 1 (completely visible) in 1 second.

🙂