ASP.NET中繼器加載圖像

在我的應用程序中，我使用了中繼器控制。爲此我一次加載項目。但我的客戶想要顯示前6項，然後如果用戶來到頁面的結尾，它將顯示圖像命名爲加載圖像，並在短時間後顯示另外6個項目，並且用戶再次到達頁面的結尾時，它將在屏幕的末尾顯示加載圖像並加載另外6個項目，如此等等。例如：Facebook的加載ASP.NET中繼器加載圖像

來源

2011-09-26 Sree

這還不清楚。請花時間充分解釋您的問題。 –

現在檢查一次我編輯 – Sree

所以它會加載圖像作爲用戶滾動，基本上？ –

這聽起來像你需要使用連續滾動，以加載圖像隨着用戶滾動。這裏有一對夫婦的文章，其演示瞭如何利用連續滾動：

http://www.ajaxprojects.com/ajax/tutorialdetails.php?itemid=371

http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/

下面是一個使用連續滾動的圖片庫的例子：

<!DOCTYPE html> 
<html> 
<head> 
    <style type="text/css" > 
    div { border: solid 1px black; height:200px; } 
    </style> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
</head> 
<body> 
    <script type="text/javascript"> 
     var pixelsBetweenImages = 200; 
     var imagesArray = {} 
     var imagesArray = new Array(); // regular array (add an optional integer argument to control array's size) 
     imagesArray[0] = ""; 
     imagesArray[1] = ""; 
     imagesArray[2] = ""; 
     imagesArray[3] = "/images/ImageThree.gif"; 
     imagesArray[4] = "/images/ImageFour.gif"; 
     imagesArray[5] = "/images/ImageFive.gif"; 
     imagesArray[6] = "/images/ImageSix.gif"; 
     imagesArray[7] = "/images/ImageSeven.gif"; 
     imagesArray[8] = "/images/ImageEight.gif"; 

     $(window).scroll(function() { 
      var scrollpos = $(window).scrollTop() + $(window).height(); 
      var imageIndex = Math.floor(scrollpos/pixelsBetweenImages); 
      if (imagesArray[imageIndex] != "") { 
       var div = $("#" + imageIndex); 
       div.html(imagesArray[imageIndex]); 
       imagesArray[imageIndex] = ""; 
      } 

     }); 
    </script> 

    <div>Visible on first load</div> 
    <div>Visible on first load</div> 
    <div>Visible on first load</div> 
    <div id="3">3&nbsp;</div> 
    <div id="4">4&nbsp;</div> 
    <div id="5">5&nbsp;</div> 
    <div id="6">6&nbsp;</div> 
    <div id="7">7&nbsp;</div> 
    <div id="8">8&nbsp;</div> 

</body> 
</html>

來源：Is there ability to load page images partially when scroll down to it or is it just effect?

至於顯示加載圖片，只需使用一個動畫GIF作爲默認圖像，並延遲加載實際圖像的效果，使用setTimeout或沿着這些線。

來源

2011-09-26 19:38:47

ASP.NET中繼器加載圖像

回答

相關問題