function creation_barre_chargement( lien)
{
    var back= document.createElement('DIV');
    back.style.position='absolute';
    back.style.top='0px';
    back.style.left='0px';
    back.style.width='100%';
    back.style.height='100%';
    back.style.background='white';
    back.style.opacity='0.8';
    back.style.filter='alpha(opacity=80)';

    var div= document.createElement('DIV');
    div.style.position='absolute';
    div.id='barre_chargement';
    div.style.width='40%';
    div.style.marginLeft='30%';
    div.style.marginTop='10%';
    div.style.border="1px solid black";
    div.style.background="#d0d0d0";
    div.style.height='20px';

    var p= document.createElement('P');
    p.style.margin='0px';
    p.style.padding='0px';
    p.style.borderLeft='1px solid #333';
    p.style.height='100%';
    p.style.background='green';
    p.style.fontWeight='bold';
    p.id='pourcentage_accompli';
    p.style.textAlign='right';

    var txt= document.createTextNode('0%');

    p.appendChild(txt);
    div.appendChild(p);
    back.appendChild(div);
    document.body.appendChild(back);

    myAjax=new Ajax.Request( lien.href, {
        method: 'get',
        onInteractive : function(response)
        {
            var pourcentage= myAjax.transport.responseText.length/response.getHeader('Content-Length')*100;
            $('pourcentage_accompli').style.width=pourcentage+'%';
            $('pourcentage_accompli').firstChild.nodeValue=pourcentage.toFixed(2)+'%';
        },
        onSuccess: function() {
            document.location.href='#'+lien.href;
            document.body.update(myAjax.transport.responseText);
        }
    });
}

Event.observe(window, 'load', function()
{
    $$('.loading_item').each(
        function(item)
        {
            item.onclick= function() { creation_barre_chargement(item); return false; }
        }
    );
});