2012-08-07 68 views
-1

也許我應該問這樣早些時候一個div ...jQuery來顯示被隱藏的CSS

我有一個加載從SQL表中的所有項目覈實。然後我有一些複選框將用於按顏色過濾,所以如果用戶選擇BLUE,則DIV將重新加載,通過藍色作爲顏色並僅顯示藍色項目。

一旦用戶點擊,我想在加載藍色項目的時間內顯示「加載」.gif。也許這是超短期或許需要3秒左右......

我的選擇是:

  • 有我的主DIV內的另一個DIV包含.gif和CSS是不顯示的。然後用一個JQUERY,我將不得不顯示它,然後隱藏它......如果這個選項是好的,我可以使用什麼樣的JQUERY?

  • 使用jQuery來.load裝車DIV之前,我過濾

感謝後,裝載的結果!

+1

看一看的[BlockUI ](http://www.malsup.com/jquery/block/#page)jQuery插件。 – Bill 2012-08-07 17:11:05

回答

1

最簡單的方法是讓DIV在網頁中,通常接近頁面的底部,隱藏着的CSS:

<div id="loading"> 
    <img src="img/loading.gif" alt="Loading." /> 
</div> 

CSS:

#loading { 
    display:none; 
    /* some more code to position the div where you want */ 
} 

JS:

$("#loading").toggle(); // or .show()/.hide() 

查看小提琴:http://jsfiddle.net/Gwmah/

0

有幾個提供b jQuery的有用的功能,以顯示html元素

  • 隱藏()顯示()
  • 肘節()

    //your css would be like this 
    #divToDisplay { 
        display:none; 
    } 
    
    $('document').ready(function() { 
    
        $('#divToDisplay').show(); 
    }); 
    
    //or to make it show hide on click use toggle() 
    $('document').ready(function() { 
    
        $('#divToDisplay').toggle(); 
    }); 
    
    //you can also use slideToggle() to give some animation for show and hide 
    $('document').ready(function() { 
    
        $('#divToDisplay').slideToggle("slow"); 
    }