Hi Friends, Today we are going to see how to create firework animation effect using jquery plugin. We as a whole are intrigued by firecrackers, for a new website launch, festival day offer page, birthday celebration, some special page you can use this effect. the firework effect will attract your site visitors.
How to use Firework Effect
Load below CSS and jquery script in the head tag.
<link href="jquerysctipttop.css" rel="stylesheet" type="text/css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script type="text/javascript" src="jquery.fireworks.js"></script>
Firework script will create randomly an HTML canvas rocket design.
HTML
Create contain html element.<body> <div id="imgs"> <img width="1350" height="700" src="bg.jpg"> <div class="content-msg"> <h2> Create Fireworks Animation Effects Using Jquery and CSS</h2> </div> </div> </body>
Jquery
#imgs - Here firework effect will only the image id. if you want to display all page just change #imgs to a body
<script type="text/javascript"> $(document).ready(function(){ setTimeout(function() { $('#imgs').fireworks(); }); }); </script>
This firework jquery plugin developed by jqueryscript.net.
Thanks... for this...
ReplyDeleteWelcome
Deletehow to remove gradient background..?
ReplyDeleteplz help me..!