Ich möchte Seite laden spinner in meiner HTML-Seite Inhalt mit jquery Mobile oder jquery. Ich versuchte einige Codierung in Jquery und Ajax. es funktioniert nicht ... gibt es eine Lösung .. kann jemand vorschlagenWie spreche ich Seite laden in meinem HTML-Seiteninhalt mit jquery mobile oder jquery
Diese sollten Ihnen helfen, das zu erreichen.
Alle diese im Grunde zeigen die gleiche Sache (Website mit Ajax geladen Inhalt und Ladeanzeige.) mit einigen Unterschieden.
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
nur ein GIF-Bild verwenden. Machen Sie einfach eine Google Bildersuche "Spinner GIF". Speichern Sie die spinner.gif lokal. Verwenden Sie "Sichtbarkeit" zu zeigen und verstecken ....
Vorgehensweise: - 1. Öffnen Sie Google.com
Klicken Sie Bildersuche
"Enter spinner.gif" in das Suchfeld
Klicken sie auf Suchen-Taste
es s geht jetzt werden Sie viele GIF-Bild Download als Ihr Wunsch (Alle GIF-Bild fit für Ihre app) Bewahren Sie es in Ihrem lokalen die Verwendung in html finden,
///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
irgendwelche Vorschläge auf Wie macht man eine Fullscreen Spinner Version? Derzeit erscheint der defauly jqm Spinner nur in einem kleinen Rechteck in der Mitte des Bildschirms. Dadurch bleibt die gesamte Seite während des Ladevorgangs anfällig für Klicks durch den Benutzer. Ich würde es vorziehen, dass das Drehfeld über einem Vollbild-Overlay (wie dem jqm-Popup) angezeigt wird, das den Rest des Inhalts blockiert. – dsdsdsdsd
@ ddsdsdsdsd Meine erste Idee war es, '.ui-loader' zu verbreiten, um das Ansichtsfenster abzudecken, aber das funktioniert nicht, da es bei jedem Scrollen einen oberen Wert erhält, um es vertikal zentriert zu halten. Das macht die Dinge sehr schwierig. Meine zweite Idee war es, ein anderes Element darum herum zu legen und es so zu verteilen, dass es das gesamte Ansichtsfenster abdeckt, aber das funktioniert nicht so gut, weil man dann die Sichtbarkeit dieses Elements getrennt vom '.ui-Loader' steuern müsste. Die einfachste Option ist, mit dem zu gehen, was du hast :) – Joonas