Question

我想使用jquery mobile或jquery在我的html页面内容中显示页面加载微调器。我在jquery和ajax中尝试了一些编码。它不起作用......有没有解决方案..任何人都可以建议我

Answer 1

这些可以帮助您实现这一目标。

所有这些基本上都显示了同样的事情^{（制作带有ajax加载内容和加载指示符的网站。）}但存在一些差异。

http://net.tutsplus.com/tutorials/javascript-ajax/how-to-load-in-and-animate-content-with-jquery/

http://tutorialzine.com/2009/09/simple-ajax-website-jquery/

http://www.queness.com/post/328/a-simple-ajax-driven-website-with-jqueryphp

Answer 2

只需使用.gif图片即可。只需进行Google图片搜索“spinner gif”即可。然后将spinner.gif保存到本地。使用“可见性”来显示和隐藏....

步骤： - 1.打开Google.com

点击图片搜索
在搜索框中输入“Spinner.gif”
点击搜索按钮

现在你会发现很多gif图像随心所欲下载（任何.gif图像适合您的应用）将它存储在本地使用的html中，

Answer 3

///HTML CODE////
<div class="loader">
</div>
<button id="btn">
click 
</button>
<p>Processing - Please wait </p>

// CSS CODE ///
.loader {
  border: 16px solid yellow;
  border-radius: 50%;
  border-top: 16px solid #1BB2AC;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/// JQUERY CODE ///
$('.loader').hide();
$('p').hide();
$('#btn').on('click', function(){
        setInterval(function(){
            $('.loader').hide();
     $('p').hide()
      $('#btn').hide();
        }, 2000)
    $('p').show();
        $('.loader').show();
    $('#btn').hide();
    });

https://jsfiddle.net/dxpkumar/4kgupxeL/#&togetherjs=8rscNma3nL

如何使用jquery mobile或jquery在我的html页面内容中显示页面加载微调器

3 个答案: