Friday, 23 August 2013

Fadein With JQUERY on click with external html file

Fadein With JQUERY on click with external html file

So I have a page, and when a user clicks on one of the navigation links
instead of changing page, it just loads the content from those pages into
the div on the main page. I did this through using JQuery the .load and
both of the tests that I tried, work perfectly with the .load.
What I wanted to see now was if instead just loading the content in all at
once I wanted to fade in slowly to make more effect, and I was curious as
whether I could do this the same way as I did the .load.
This is the code that I used in JQUERY to do the .load on the click:
function loadPage(){
$('#page').load ('art1.html #content');
}
and then this function is called in the HTML as Follows:
<a href="#" onclick="loadPage();">click me</a>
This works perfectly fine but I would prefer it if it faded in instead:
I know that I cannot just change the .load to to the .FadeIn as of the way
that this written but how would I write the .fadeIn function.
page= The Div on the main page that I want the content loaded into
content= The div on the external HTML file where the content is written

No comments:

Post a Comment