Hallo,
habe jetzt einiges übers WE ausprobiert und dachte schon eine Lösung gefunden zu haben,
aber denkste - es will nicht funktionieren
Mein Ansatz war folgender (hattest Du auch schon mal so angeschnitten):
Ich habe meine index.html, aus der habe ich nun eine "Multipage" gemacht, die sieht dann so aus.
Das "setTimeout" habe ich gesetzt, da man ja sonst nur das "Daten werden geladen" sieht, wenn man im Browser zurück geht.
Das Ganze funktioniert aber irgendwie nur beim ersten Mal, beim zweiten Mal wird dann "fast sofort" die test.html angezeigt
ohne inhalte, wenn dann alle Inhalte da sind, wird die Seite befüllt...
Das Script im Header (hier auskommentiert) sollte eigentlich bewirken, dass er immer die Seite neu lädt, also nix cacht,
funktioniert aber irgendwie auch nicht.
Habt Ihr vielleicht noch einen Tipp für mich?
Lieben Gruß, Blaubär
habe jetzt einiges übers WE ausprobiert und dachte schon eine Lösung gefunden zu haben,
aber denkste - es will nicht funktionieren
Mein Ansatz war folgender (hattest Du auch schon mal so angeschnitten):
Ich habe meine index.html, aus der habe ich nun eine "Multipage" gemacht, die sieht dann so aus.
HTML:
<!DOCTYPE html>
<html>
<head>
<title>XYZ</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css" />
<link rel="stylesheet" href="css/style.css" />
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.mobile-1.3.2.min.js"></script>
<script src="js/main-min.js"></script>
<script language="javascript" type="text/javascript">
function spin(){
$("#start").hide();
$("#spinner").show();
setTimeout(function() {
$("#spinner").hide();
$("#start").show();
}, 1000);
}
/*
$(document).on("pagehide", "div[data-role=page]", function(event){
//$("#start").show();
//$("#spinner").hide();
$(event.target).remove();
});*/
</script>
</head>
<body>
<!-- Multipage Part 1 -->
<div data-role="page" id="start">
<div data-role="header">
<h5>Head</h5>
</div><!-- /header -->
<div date-role="content">
<a href="test.html" onClick="spin();" data-transition="none">Link</a>
</div><!-- /content -->
<div data-role="footer">
</div><!-- /footer -->
</div><!-- /page -->
<!-- Multipage Part 2 -->
<div data-role="page" id="spinner">
<div data-role="header"></div><!-- /header -->
<div date-role="content">
<div id="grafik">
<div class="spinner">
<img src="img/spinner.gif" width="30px" height="31px" style="border: 0px;" /> Daten werden geladen...
</div><!-- class-spinner ENDE -->
</div><!-- grafik ENDE -->
</div><!-- /content -->
<div data-role="footer"></div><!-- /footer -->
</div><!-- /page -->
</body>
</html>
Das Ganze funktioniert aber irgendwie nur beim ersten Mal, beim zweiten Mal wird dann "fast sofort" die test.html angezeigt
ohne inhalte, wenn dann alle Inhalte da sind, wird die Seite befüllt...
Das Script im Header (hier auskommentiert) sollte eigentlich bewirken, dass er immer die Seite neu lädt, also nix cacht,
funktioniert aber irgendwie auch nicht.
Habt Ihr vielleicht noch einen Tipp für mich?
Lieben Gruß, Blaubär