Custom animations

Using the URL animator you can display in the address bar whole UTF-8 char set. Therefore it is possible to assemble your own animations

Watch the address bar to see the demo

You can setup the animation texts into <p> tags of the parental #pacman <div> and it will be automatically used as input for the URL animator plugin

<div id="pacman" style="display: none">
    <p>ᗧ●●●●●●●●●●●●●●● </p>
    <p>O●●●●●●●●●●●●●● </p>
    <p>ᗧ●●●●●●●●●●●●●● </p>
    <p>O●●●●●●●●●●●●● </p>
    <p>ᗧ●●●●●●●●●●●●● </p>
    <p>O●●●●●●●●●●●● </p>
    <p>ᗧ●●●●●●●●●●●● </p>
    <p>O●●●●●●●●●●● </p>
    <p>ᗧ●●●●●●●●●●● </p>
    <p>O●●●●●●●●●● </p>
    <p>ᗧ●●●●●●●●●● </p>
    <p>O●●●●●●●●● </p>
    <p>ᗧ●●●●●●●●● </p>
    <p>O●●●●●●●● </p>
    <p>ᗧ●●●●●●●● </p>
    <p>O●●●●●●● </p>
    <p>ᗧ●●●●●●● </p>
    <p>O●●●●●● </p>
    <p>ᗧ●●●●●● </p>
    <p>O●●●●● </p>
    <p>ᗧ●●●●● </p>
    <p>O●●●● </p>
    <p>ᗧ●●●● </p>
    <p>O●●● </p>
    <p>ᗧ●●● </p>
    <p>O●● </p>
    <p>ᗧ●● </p>
    <p>O● </p>
    <p>ᗧ● </p>
    <p>O </p>
    <p>ᗧ </p>
    <p>O</p>
    <p>ᗧ</p>
    <p></p>
</div>

  
<script type="text/javascript">
    $(document).ready(function(){
        $("#pacman").urlAnim({
            type: "show",
            align: "right",
            chars: 20,
            query: { 
                delay: 150,
                repeat: 0
            }
        });
    });
</script>