Fade In/Out Page Loading Effect On Blogger Posts
A very common effect in jQuery is the fade effect, which hides or reveals an element by fading it, and we can use it in many ways, such as blog navigation. This is done with the following script, which loads the page with a fading effect when viewing internal links found on the blog, such as post titles, tag links, archives, navigation links, etc.
You can see an example on this demo blog , click on any post title and see the fade effect as the page loads.
2) Click anywhere in the code field and search. label using CTRL+F:
3) then up add this code:
When the source script hides the page body on load, I prefer to change this property to a negative z-index to avoid issues with search engine crawlers that could affect rankings.
Issues?
Keep in mind that such effects can increase the load time of your blog, so I recommend using them only when your blog loads quickly and doesn't contain too many scripts.
If you're already using a different version of jQuery, remove the other one, leaving only the one you read about earlier.
If you are using Mootools or Scriptaculous, you will need to make some code changes to make it compatible.
If you have another script with a fade effect, it can get in the way and you may not see anything on the page other than the color fade, in which case it's best to skip that script.
You can only use this effect on certain links, like navigation links (old and new posts) and it only appears when you click on post titles in top tabs, replace this line:
Aside from these drawbacks, I think this is a great way to load blog pages while browsing, right?
How to set the fade effect
1) To put this fading effect on your blog, go to " Template " > " Edit HTML ":2) Click anywhere in the code field and search. label using CTRL+F:
3) then up add this code:
4) Save changes and exit. You can see green where to change the color that disappears on the download page.
When the source script hides the page body on load, I prefer to change this property to a negative z-index to avoid issues with search engine crawlers that could affect rankings.
Issues?
Keep in mind that such effects can increase the load time of your blog, so I recommend using them only when your blog loads quickly and doesn't contain too many scripts.
If you're already using a different version of jQuery, remove the other one, leaving only the one you read about earlier.
If you are using Mootools or Scriptaculous, you will need to make some code changes to make it compatible.
If you have another script with a fade effect, it can get in the way and you may not see anything on the page other than the color fade, in which case it's best to skip that script.
You can only use this effect on certain links, like navigation links (old and new posts) and it only appears when you click on post titles in top tabs, replace this line:
$("to"). function click(event) {OF:
$(".post-headline a, .blog-pager-old-link, .blog-pager-newest-link, .tabs") click (function (event) {In some cases the page may load for a second and then load with a fade effect, which may be "normal" as the browser loads the script slowly when the page loads.
Aside from these drawbacks, I think this is a great way to load blog pages while browsing, right?
