將預加載器添加到div標記

我們有一個ajax腳本，用於獲取單詞並將一些相關數據加載到div標記中。將預加載器添加到div標記

它工作正常，但我們要添加預加載（無jQuery的）到div標籤，我們試圖spin.js但它僅適用於整個頁面，這就是我們所做的：（彙總）

<head> 
<script src="spin.min.js"></script> 
</head> 

<body> 
<div id="data"> 

//data loads here 

</div> 

<script type="text/javascript" charset="utf-8"> 
var opts = { 
    lines: 13, // The number of lines to draw 
    length: 7, // The length of each line 
    width: 4, // The line thickness 
    radius: 28, // The radius of the inner circle 
    rotate: 0, // The rotation offset 
    color: '#000', // #rgb or #rrggbb 
    speed: 1, // Rounds per second 
    trail: 92, // Afterglow percentage 
    shadow: false, // Whether to render a shadow 
    hwaccel: false, // Whether to use hardware acceleration 
    className: 'spinner', // The CSS class to assign to the spinner 
    zIndex: 2e9, // The z-index (defaults to 2000000000) 
    top: 'auto', // Top position relative to parent in px 
    left: 'auto' // Left position relative to parent in px 
}; 
var target = document.getElementById('data'); 
var spinner = new Spinner(opts).spin(target); 
</script> 


</body>

是什麼錯誤？和任何其他（和更好的）解決方案？

來源

2012-06-06 W2-S

你的datadiv已全寬，spin.js將圖像放置在元素的中心，既垂直也水平這就是爲什麼你看到這在全屏幕上的基礎。

例如，

<head> 
    <script src="spin.js"></script> 
</head> 
<body> 
    <div id="data" style="width: 100px; height: 100px; float: left;"> 
     <!-- Data Loads Here--> 
    </div> 
    <div id="NoData" style="width: 100px; height: 100px; float: left;"> 
     Hello Hi Bye 
    </div> 
    <script type="text/javascript" charset="utf-8"> 
     var opts = { 
      lines : 13, // The number of lines to draw 
      length : 7, // The length of each line 
      width : 4, // The line thickness 
      radius : 28, // The radius of the inner circle 
      rotate : 0, // The rotation offset 
      color : '#000', // #rgb or #rrggbb 
      speed : 1, // Rounds per second 
      trail : 92, // Afterglow percentage 
      shadow : false, // Whether to render a shadow 
      hwaccel : false, // Whether to use hardware acceleration 
      className : 'spinner', // The CSS class to assign to the spinner 
      zIndex : 2e9, // The z-index (defaults to 2000000000) 
      top : 'auto', // Top position relative to parent in px 
      left : 'auto' // Left position relative to parent in px 
     }; 
     var target = document.getElementById('data'); 
     var spinner = new Spinner(opts).spin(target); 
    </script> 
</body>

來源

2012-06-06 16:57:52 mprabhat

但是：1 - spining的工作，直到整個頁面加載（圖片，logoes等）2 - 當測試ajax它加載數據沒有任何加載飛濺。 –

你是如何初始化你的旋轉ajax開始？ – mprabhat

似乎它的重點..如何做到這一點？（我是阿賈克斯/裝載機處理noobot） –

將預加載器添加到div標記

回答

相關問題