Wie könnte man die mobile Safari-Navigationsleiste unten drücken, um sie programmgesteuert anzuzeigen?

Question

Ich habe eine feste Schaltfläche für einen CTA (Call to Action) am unteren Rand meiner Webseite. Beim Blättern auf der Seite einer neueren iOS-Version blendet Safari die untere Navigationsleiste aus (mit Schaltflächen für Zurück, Weiter, Freigeben, Lesezeichen und neue Tabs). Wenn Sie auf die CTA-Schaltfläche klicken, zeigt Mobile Safari anstelle der Aktion die untere Navigationsleiste an.

Als Lösung, ich war immer auf der Suche nach der unteren Navigationsleiste. Gibt es eine Möglichkeit, dies zu tun? Sowohl Jack Threads bei der Anzeige auf Mobilgeräten als auch Thread Flips mobile Websites sind in der Lage, dies bei der Anzeige eines einzelnen Artikels abzurufen.

Ich kann dies bis jetzt nicht rückentwickeln. Weiß jemand, wie die Force-Show zustande kommt?

zu: Buttons aligned to bottom of page conflict with mobile Safari's menu bar und Prevent Mobile Safari from presenting toolbar when bottom of viewport is tapped

Answer 1

Ich habe das gleiche Problem. Wir arbeiten an der Implementierung einer Navigation auf unserer Website und die Safari bringt uns Probleme, denn wenn Sie unten auf den Bildschirm tippen, öffnet sich das untere Navigationsfenster von Safari. Die beste Lösung, die wir uns ausgedacht haben, ist, einen 44px-Platz unterhalb der Navigation hinzuzufügen, der wirklich schlecht aussieht. Es wäre schön, wenn ich die Navigation der Safari zwingen könnte, offen zu bleiben, damit sie diesen Raum füllen kann, anstatt einen im Wesentlichen nutzlosen leeren Block.

Answer 2

Ich denke, ich habe vielleicht eine Antwort gefunden. Setzen Sie Ihre Inhalte die folgenden Stile haben:

• height: 100% (erlaubt Inhalt der Ansichtsfenster und gehen über die Boden zu füllen)
• overflow-y: scroll (können Sie unter dem Bildfenster scrollen; der Standardwert ist sichtbar) immer erscheinen
• -webkit-overflow-scrolling: touch (jedes Scroll-Verhalten zu glätten)

das iOS-Menü in Safari zu zwingen, wird angezeigt. Auf diese Weise funktionieren Schaltflächenklicks tatsächlich, anstatt das Safari-Menü zu öffnen.

Leider müssen Sie dieses CSS mit JavaScript-Browser-Erkennung paaren, weil es das Scrollen auf iOS Chrome (auch Webkit) vermasselt. Es gibt keine Möglichkeit, alle Versionen von iOS Safari nur mit nur CSS zu targetieren.