Quickly add animations to your WordPress blog.

The Halloween Scene animation is made of 5 images. All images positions are set to absolute, and they are placed inside a box that is set to relative. It’s easier to modify them or to integrate this animation into any web page layout. They are many ways to make the same animation.

HTML - Copy and Paste the HTML into a post, page or text widget (add full URL to images).

<style type="text/css">
#twiz-h-box {
    width: 700px;
    height: 450px;
    display: block;
    border: 15px solid #F88017;
    overflow: hidden;
    background-color: black;
}
#twiz-h-box img {
    display: none;
}
#twiz-clown,
#twiz-owl {
    display: none;
    opacity: 0;
    filter: alpha(opacity=0);
}
</style>
<div id="twiz-h-box"><img src="../wp-content/uploads/twiz-full-moon.png" alt="" title="" width="100" height="99" id="twiz-moon"/><img src="../wp-content/uploads/twiz-pumpkin-dark.png" alt="" title="" width="300" height="262" id="twiz-pumpkin-1"/><img src="../wp-content/uploads/twiz-pumpkin-dark.png" alt="" title="" width="300" height="262" id="twiz-pumpkin-2"/><img src="../wp-content/uploads/twiz-evil-clown.png" alt="" title="" width="300" height="225" id="twiz-clown"/><img src="../wp-content/uploads/twiz-owl-in-tree.png" alt="" title="" width="300" height="216" id="twiz-owl"/><img src="../wp-content/uploads/twiz-zombie-green.png" alt="" title="" width="231" height="300" id="twiz-zombie"/></div>

• twiz-full-moon.png
• twiz-pumpkin-dark.png
• twiz-evil-clown.png
• twiz-owl-in-tree.png
• twiz-zombie-green.png

Upload JavaScripts into the Welcomizer Library.

• jquery-animate-css-rotate-scale
  - jquery-animate-css-rotate-scale.js
  - jquery-css-transform.js

* It’s not working on IE < 9.