JQuery скрыть Div

Question

Я надеюсь, что кто-то может мне помочь.Я нашел этот скрипт jquery для загрузки контента в темпе, используя ajax

$(document).ready(function(){
    //References
    var sections = $("#menu li");
    var loading = $("#loading");
    var content = $("#content");

    //Manage click events
    sections.click(function(){
        //show the loading bar
        showLoading();
        //load selected section
        switch(this.id){
            case "home":
                content.slideUp();
                content.load("/includes/content.asp", hideLoading);
                content.slideDown();
                break;
            //case "news":
            //  content.slideUp();
            //  content.load("sections.html #section_news", hideLoading);
            //  content.slideDown();
            //  break;
            case "interviews":
            content.slideUp();
            content.load("/includes/test1.asp", hideLoading);
            content.slideDown();
            break;
            case "external":
                content.slideUp();
                content.load("/includes/test.asp", hideLoading);
                content.slideDown();
                break;
            default:
                //hide loading bar if there is no selected section
                hideLoading();
                break;
        }
    });

    //show loading bar
    function showLoading(){
        loading
            .css({visibility:"visible"})
            .css({opacity:"1"})
            .css({display:"block"})
        ;
    }
    //hide loading bar
    function hideLoading(){
        loading.fadeTo(1000, 0);
    };
});

И эта строка кода находится на главной странице

    <div id="loading">
  <div align="center"><img src="/css/images/loading.gif" alt="Loading" /></div>
</div>

Мне нужно скрыть загрузочное изображение, когдамоя страница загружается (скрыть DIV ID = "loading"), она не скрывается при загрузке страницы, и когда я нажимаю на ссылку, чтобы загрузить контент на мою страницу, div перемещает мой контент вниз ...

какие-нибудь идеи о том, как я могу скрыть div, когда загрузка div завершена?

Спасибо

Answer 1

$(document).ready(function(){
    //References
    var sections = $("#menu li");
    var loading = $("#loading").hide();  // Hide the loading image on page load
    var content = $("#content");

И вместо использования .fadeTo() используйте .fadeOut(), чтобы загружаемое изображение было скрыто в конце анимации.

function hideLoading(){
    loading.fadeOut(1000);
};

Кроме того, улучшение вашего showLoading()может быть:

function showLoading(){
    loading.show();
      // or if you want it animated
      // loading.fadeIn(200);
}

Answer 2

Вы можете попробовать следующее:

$(document).ready(function(){
   $('#loading').css('display','none'); /*If you want the div to appear as if it never existed*/
   $('#loading').css('visibility','hidden'); /*If you want the div to be 'hidden' but keep the space that it occupies.*/
});

Answer 3

Вам просто нужно позвонить:

$("#loading").hide();

Позвоните на $(document).ready