Значок загрузки на обратной передачи Ajax в PHP

---

This is my first php project. I have imlemented partial ajax postback by referring to this article of PHP AJAX MYSQL from W3Schools

Now, I am trying to show a loading gif when the partial loading starts and hide it when the partial loading completes. Here is the code that I am using in Javascript:

<pre lang="Javascript">function showUser1(str) 
    {
        if (str == "") 
        {
            document.getElementById("mems").innerHTML = "I caanot fetch: " + str;
            return;
        }
        else 
        { 
            document.getElementById("loadgif").style.visibility= "visible";
            if (window.XMLHttpRequest) 
            {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else 
            {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() 
            {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
                {
                    document.getElementById("outerpicwrapper").innerHTML = "";
                    document.getElementById("mems").innerHTML = xmlhttp.responseText;
                }
            };
            xmlhttp.open("GET","getmembers.php?q2="+str,true);
            xmlhttp.send();
            document.getElementById("loadgif").style.visibility= "hidden";
        }
    }

В первой строке тела я написал:

<img id="loadgif" src="img/loading.gif" 

class= "loadinggif" />
В CSS-файле я написал:

.loadinggif
{
position: absolute;
z-index: 200;
visibility: hidden;
}

Код работает нормально и показывает данные, но загрузка gif не отображается. Я даже пробовал display:none и display: block вместо видимости. Пожалуйста, помогите.

Что я уже пробовал:

видимость: скрытая
дисплей: нет

---