Background cover while page resize

Question

My page has some animations that sometimes change the page height (on purpose), so initialy when the page is loaded and page height is 100%, the background image covers the page. But when it runs the animations, the page height can go beyond 100%. The only way to effectively cover all the background is to change background height from auto to a bigger value (eg 200%), but doing so i am also changing the page height. In other words, is it possible to cover (dynamically) the page when the animations are running while keeping page height at 100% when animations are not running?

my css code for the background:

background: url(background2.jpg)repeat 5% 5%;
position: absolute;
background-size:cover;
top: 0; left: 0; right: 0; bottom: 0;
z-index: 400;
height: auto;
width: auto;

Answer 1

$(document).ready(function(){
    var isAnimating = $("#someid").is(':animated'); 
    //will return true if selected element animating
    if(isAnimating == true){
        $('#div').css('height','value');
    }
    else{
        $('#div').css('height','value');
    }
});   

Answer 2

    background: url('') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    opacity: 0.6;
    filter: alpha(opacity=60);/* For IE8 and earlier */
    width: 100%;
    height: 100%;
    overflow: hidden;

hi friends apply this css