Tag: JS

T1 logo in JS+PNG

Initially, my logo was 105K GIF. Now it’s transparent PNG+JS. As easy as:

            //
            var color = 0;
            var interval = 60;  /* time msec, after which color changes */
            var clrInc = 4;     /* HSV degree increment */
            function chcolor(){
                var t1_logo = document.getElementById("t1_tl"); /* div_to_animate */
                color < 360 ? color = color + clrInc : color = 0;
                t1_logo.style.backgroundColor = "hsl("+color+", 100%, 50%)";
            }

            function stchcol(){
                var logoChCol = setInterval(chcolor, interval);
            }
            window.onload = stchcol;
            //-->

and

Main page

Benefits are smaller page size, smaller prcessor load. Eventuall, animation in JS consumes lees resources than a GIF rendering. 35% losad with GIF animation vs 15% load with JS animation. At least, in Fedora 16 with nouveau.

The idea was given to me by fiskus, but it was quite a long ago, so I feel I had the same idea at the moment he suggested it to me. Nevertheless, he desrves a credit.