How To Create Animated Fireworks Jquery Effect in Blogger

Many bloggers would love to have their blogs covered by the Fireworks Animated on their blog as well as me,  Today, I'm going to show you how to create animated fireworks Jquery Effect in Blogger.

How The jQuery Fireworks Widget Looks Like?

There is no rocket science behind this widget because we have used a modest Jquery functionality which creates an Animated Firework Effect. Have you ever witness a New Year Eve’s Fireworks? It usually consists of firecrackers of different types. Keeping that in mind, we have created a widget based on Firecrackers. Whenever, a visit would visit your website it would display Animated Firecrackers all across your site. Consider the following screenshot to clear your concept. 

Add New Year Fireworks Effect in Blogger?

The steps mentioned below are extremely straightforward and would take less than 3 minutes to complete the integration. There is no need to learn anything just follow the steps as they are mentioned below. 

Go To Blogger.com >> Template >> Edit HTML >> Proceed.

In the Template, search for the ]]></b:skin> Tag and just above it paste the Following CSS Coding. Please, don’t try to modify or customize the CSS otherwise it may not give the desire results which we are expecting.

#mblfireworks{
            display: block;      
            width: 1000px;
            height: 735px;
            float: center;
            color:#6F6F6F;
            text-align: center;
            font-size: 12px;
        }
        #mblfireworks a {
            color:#6F6F6F;
        }

Once Again in the template Search For the </body> tag and just below it Paste the Entire Jquery Coding. If anyone is unable to find the </body> tag in their template then, he can Paste the Following coding just below your Footer coding.

<div id="mblfireworks">  </div> 

<script src="http://tanachhim.googlecode.com/files/khmer-blogger%20animation1.js" type="text/javascript"></script>

<script src="http://tanachhim.googlecode.com/files/khmer-blogger%20animation2.js" type="text/javascript"></script>

<script>
/*Fire Works khmer-blogger*/   
jQuery(function($){               
Xteam.fireworkShow('#mblfireworks', 100);                 
});   
</script>

All Done: After customizing, Save the Template by Pressing “Save Template” button. Feel Free to leave your suggestions and comments if there is a room for improvement. 
 How To Add Christmas Snow Fall Effect in Blogger Blogs

From The Editor's Desk:

We hope this widget will help everyone to decorate their site with Fireworks. Wishing you a Happy New year in advance. Hopefully, we will be there to wish you on the New year's Night too. What are your thoughts about this jQuery Effect? Take a lot care till then peace, Blessings and happy fire cracking. 

Posted by Best Skills

Tweet