Показывать индикатор выполнения при загрузке изображения в веб-форме ASP.Net

Question

Я работаю над веб-сайтом, в котором есть раздел статьи и отображаемое изображение для всех статей на странице Домашняя страница и страница статей. Некоторые из этих изображений загружаются как png и имеют размер больше 11 КБ.

Предположим, что я показываю 20 статей на странице с 20 изображениями. иногда изображение занимает время для загрузки. Я хочу показать индикатор выполнения для каждого изображения, которое будет загружено. Я искал его в сети, но я не могу получить нужный материал.

Я был бы признателен, если кто-то может указать мне в правильном направлении.

Я разрабатываю этот сайт в ASP.Net 4.0, C#. Я использую простое управление ASP.Net изображения для отображения изображения Теперь я хочу, чтобы интегрировать с некоторой функцией JQuery, так что он будет показывать какой-то эффект Загрузка ... до изображение фактически загружен

что-то похожее на http://rascals.eu/templates/rt0802/portfolios/portfolio-2-columns/

Answer 1

Я НАШЕЛ простое решение с помощью CSS

.ImageClass 
{ 
     display: block; 
     background-image: url('../images/loading-circle.gif'); 
     background-position: center center; 
     background-repeat:no-repeat; 
} 

работает как шарм .. Я ценю другой ответ, который также может быть полезным

Answer 2

Вы можете поместить загрузку в тег div или span и показать или скрыть ее, когда хотите ее показать. Если вы хотите сначала показать его, просто поместите функцию jQuery .hide() на div или span в jQuery на готовой функции.

Посмотреть JQuery документы на show() и hide()