Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
somian
Threadersteller
Dabei seit: 24.06.2009
Ort: Leipzig
Alter: -
Geschlecht:
|
Verfasst Fr 21.08.2009 18:50
Titel Webapp auf iPhone: verlassen in richtung browser verhindern |
|
|
hallo, ich bastel gerade eine iphone version meiner seite ,
ihr findet sie bei www.paythegame.net/iphone/app.php
Zum hinzufügen zum iPhone/iPod touch:
-die seite im safari öffnen
-auf das '+' tippen
-auf "zum home-bildschirm tippen
-'hinzufügen' tippen
hier mein problem:
Die navigation funktioniert auch prima im safari. Wenn ich allerdings die webapp aufmache, und danach eines der icons antippe, geht wieder der safari auf und damit der vollbildmodus ohne die navigations-und adressleiste zu.
Wie kann ich es verhindern, dass das passiert?
(die seite ist noch nicht fertig, es geht ja hier nur um die navigation)
hier der quellcode der app:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--iphone Zeuch-->
<meta content="yes" name="apple-mobile-web-app-capable" />
<link rel="apple-touch-icon" href="preview.png"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<!---->
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no" name="viewport" />
<link href="iphone.css" rel="stylesheet" type="text/css" />
<title>paythegame</title>
<meta content="paythegame,highscore,leaderboard,abundance" name="keywords" />
<meta content="PayTheGame.net - real life highscores" name="description" />
</head>
<body>
<?
$myname="app.php";
include("../inc/mysql.php"); //die datenbankkonfiguration einbinden
$features=array("pay","search","blog","stats","info","contact","help");//hardcoded <--!
//variable auslesen
$b=$_GET['b'];
//varible beim erstbesuch zuruecksetzen auf die highscoreliste
if (!$b)
{
$b="highscore";
}
//banner ausgeben
echo('<div id="banner">');
if($b=="highscore")
{
echo('<img src="img/banner_a.png"/>');
}
else
{
echo('<a href="'.$myname.'?b=highscore"><img src="img/banner.png"/></a>');
}
echo('</div>');
echo('<div id="bar">'); //grosses div fuer die titelleiste, anfang
//ausgeben der verschiedenen elemente der leiste
for ($i=0;$i<count($features);$i++)
{
if($b==$features[$i])
{
echo('<img src="img/'.$features[$i].'_a.png"/>');
}
else
{
echo('<a href="'.$myname.'?b='.$features[$i].'"><img src="img/'.$features[$i].'.png"/></a>');
}
}
echo('</div>');//grosses div fuer die titelleiste, schluss
//content ausgeben
echo('<div id="content">'); //anfang
include('content/'.$b.'.php');
echo('</div>');//schluss
?>
</body>
</html> |
|
|
|
|
|
ghostface
Dabei seit: 02.07.2008
Ort: -
Alter: 112
Geschlecht:
|
Verfasst Fr 21.08.2009 20:00
Titel
|
|
|
das is doch kein app was du machst, das is einfach nur ne angepasste internetseite
|
|
|
|
|
Anzeige
|
|
|
choise
Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht:
|
Verfasst Fr 21.08.2009 22:23
Titel
|
|
|
oke also:
1. du brauchst einfach ein javascript was deinen content ein bisschen scrollt.
Es gibt keinen "Vollbildmodus". sondern man versteckt einfach die URL Leiste durch ein scrollen per js, Zb:
Code: |
<script type="application/x-javascript">
if (navigator.userAgent.indexOf('iPhone') != -1) {
addEventListener("load", function() {
setTimeout(hideURLbar, 0);
}, false);
}
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
|
2. würde ich dir empfehlen dein layout für deine webseite nicht statisch zu machen und den viewport anzupassen, damit kriegst du enorme probleme wenn der safari mal im landscape mode läuft.
http://screenr.com/V0s
Deine ganzer Content liegt so ganz links am Rand (ausser natürlich es ist so beabsichtigt)
|
|
|
|
|
somian
Threadersteller
Dabei seit: 24.06.2009
Ort: Leipzig
Alter: -
Geschlecht:
|
Verfasst Fr 21.08.2009 23:11
Titel
|
|
|
hm naja, es ist ja eine webapp. Sie wird also nicht direkt über den borwser aufgerufen, sondern über den homescreen, und startet dann im "echten" vollbildmodus.
Kannst es dir ja mal auf dem iphone anschauen das funktioniert tatsächlich mit diesen drei zeilen code, die die seite an das iphone anpassen. Und es funktioniert nur, wenn man es über den homescreen aufruft. wenn man es am browser anschaut, ist es wie eine gewöhnliche internetseite. Ich möchte ja auch die untere leiste loswerden.
Das mit dem vollbild ist als nicht mein problem, sondern eher, wie ich verhindern kann, dass dieser verlassen wird, wenn ich innerhalb meiner webapp eine seite aufrufe.
das mit dem drehen hab ich schon auf dem iphone probiert, und ich werde mir da auch noch etwas einfallen lassen, das ist aber bisher nicht das primäre problem.
Hier mal ein video das genau mein Problem verdeutlicht:
http://www.youtube.com/watch?v=1sr_Q0XcPgw
Zuletzt bearbeitet von somian am Fr 21.08.2009 23:22, insgesamt 3-mal bearbeitet
|
|
|
|
|
choise
Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht:
|
Verfasst Fr 21.08.2009 23:23
Titel
|
|
|
ahh jetzt weiss ich was du meinst.
momentan werden alle links wenn man eine seite über das springboard mit "apple-mobile-web-app-capable" startet in einem neuen tab geöffnet. das einzige was abhilfe schaffen würde, wäre deine inhalt per ajax nachzuladen, nicht als einzelne seiten.
ansonsten musst du damit leben, ein bisschen angenehmer könntest du es noch mit "apple-mobile-web-app-status-bar-style" -> black-translucent machen, aber ich denke mit den JS.Frameworks heutzutage ist ajax ja nichtmehr das problem.
|
|
|
|
|
|
|
|
Ähnliche Themen |
[webapp] jQTouch reagiert langsam im iPhone
Flash und XML Datei: Wie caching im Browser verhindern?
iPad Webapp - PDF nicht im Safari öffnen
Screen Conversion iPhone 5 zu iPhone 4 und iPad
[(x)html] valide Frameset verlassen
[javascript] firefox zickt beim verlassen der seite
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben. Du kannst auf Beiträge in diesem Forum nicht antworten. Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|