bottom strip promotion, checks for css3 animation availability with fallback

bottom_promo_animate.js

/*
* bottom strip promotion 
*/

jQuery(document).ready(function() {

( function( $, window, undefined ){

    var didScroll = false,
        uped = false,
        doing = false,
        $promo = $( '.carriage-promo' ),
        windowsHeight = $(window).height(), // current window height
        documentHeight = $(document).height(); // current document size


        if ($(document).height() > $(window).height()) { // checks if body height is higher than window height
        } else {
            $('.carriage-promo').addClass('newid'); // if it is, and scrolling is not possible, div id changes to fix strip at bottom
        } // please note: height: 40px !important is extremely important


    $( window ).scroll( function(){
        didScroll = true;
    });

    (function loop(){
        window.setTimeout( function() {
            if ( didScroll ){
                didScroll = false;
                doBanner();
            }
            loop();
        }, 200);
    }());

    var _tranisitions = function(){ // checks if CSS3 transition is available (not supported by IE8-) le graceful degradation
        var elem = window.document.createElement( 'Detect' ).style,
            toTest = [ 'webkitTransition','MozTransition','OTransition','msTransition','khtmlTransition','transition'],
            len = toTest.length;

        while (len-- ) {
            if ( elem[ toTest[ len ]] !== undefined ) return true;
        }
        return false;
    }();

    // function to animate banner
    // rewrites itself depending on whether transitions are available
    // cross firing prevented by animate version updates "true"

    function up(){
        if ( !_tranisitions ) {
            up = function() {
                doing = true;
                $promo.animate( {
                    height: '40px'
                }, 500, function(){
                    doing = false;
                    uped = true;
                });
            }
        } else {
            up = function() {
                $promo.height( '40px' );
                uped = true;
            }
        }
        return up();
    }

    // down() is pretty much the same as up() ... except down

    function down() {
        if ( !_tranisitions ) {
            down = function() {
                doing = true;
                $promo.animate( {
                    height: '0px'
                }, 500, function(){
                    doing = false;
                    uped = false;
                });
            }
        } else {
            down = function() {
                $promo.height( '0px' );
                uped = false;
            }
        }

        return down();
    }

    //to do: if product detail page or basket page - static, if checkout - hidden, else animated

    function doBanner() { // function called from within the setTimeout loop

        if ($('body').hasClass('catalog-product-view') ) {
            $('.carriage-promo').addClass('newid');
        } else if ($('body').hasClass('checkout-cart-index') ) {
            $('.carriage-promo').addClass('newid');
        }
        else if ($('body').hasClass('checkout-onepage-index') ) {
            $('.carriage-promo').css("display", "none");
        } else {

        var scrollPos = $( window ).scrollTop(), //
            scrolledPercentage = (scrollPos * 100) / windowsHeight; // calculates percentage in relation to current window size, currently not used

        if ( scrollPos > 220 && !uped && !doing) { // for percentage use: if ( scrolledPercentage > 50 && !uped && !doing) {
            up();
        } else if ( scrollPos <= 220 && !doing && uped ) { //for percentage use: else if (scrolledPercentage <= 50 && !doing &&uped) {
            down();
        }
    }
    }
}( jQuery, window ));
});