How To Add jQuery FadeIn and FadeOut Effect to Blogger

If you want to add FadeIn and FadeOut effect to your blog, follow the steps below.

1.Log in to your dashboard--> layout- ->Page Elements

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the javascript code given below and click save.

<script type="text/javascript">
$(document).ready(function(){
$("#butFadeOut").click(function () {
$("#pFadeInOut").fadeOut(3000);
});

$("#butFadeIn").click(function () {
$("#pFadeInOut").fadeIn(3000);
});
});
</script>

<button id="butFadeOut">Fade Out</button>&nbsp;&nbsp;<button id="butFadeIn">Fade In</button>
<br />
<p id="pFadeInOut">Insert Your Content Here</p>

Note : Remember to replace 'Insert Your Content Here' with your real content.




Look at the example below.


Insert Your Content Here

0 comments:

Post a Comment

 

Support By Blogger