ここに大きな SVG ドキュメントがあり、特定のオンライン ゲームのすべてのクエストのマップが含まれています。各クエスト ノードは SVG 内にあります<a>別のタブに読み込まれる大きな HTML ドキュメント内の個別の名前付きアンカーにリンクし、その特定のクエストに関する詳細が含まれています。これは、デスクトップ Safari では希望どおりに機能します。また、最も基本的な形式のリンクしか使用していないため、SVG をサポートするすべてのブラウザーでも同様に機能することを期待していますが、モバイル Safari (iOS) ではうまく機能しません。 6) - 問題のゲームが iPad 向けであることを考えると、これは私の最も重要なブラウザ ターゲットの 1 つです。HTML ページの最初の読み込み時にのみ、正しいアンカーまでスクロールします。SVG タブで別のクエストをクリックすると、HTML タブに切り替わり、アドレス バーのハッシュ (フラグメント ID) が変更されますが、ページは自動スクロールしません。
これは、Mobile Safari の既知の制限のようです。URL のハッシュのみの変更は、ページのリロードを強制するために使用されているようで、過剰に修正されたため、現在は何もトリガーされていません。私がオンラインで見つけた修正はすべて、別のドキュメントからの静的リンクではなく、同じドキュメント内からプログラムで URL の変更が生成されている場合にのみ適用できるようです。
詳細:
- 名前付きアンカーを古い
<a name="...">形式と新しい<h1 id="...">形式の両方で実行してみました。変わりはない。 - スクロールを強制的に実行するためにハンドラーを追加しようとしました
onhashchangeが、ハンドラーはまったく呼び出されていません (alert() を入れて確認しました)。 - おそらく、各クエストの詳細を個別の HTML ファイルに入れることで問題を解決できると思いますが、それは使いやすさに深刻な影響を与えます.1 つのファイルにすべての詳細が含まれていると、ブラウザーの検索機能を使用してそれらを一度に検索できます. (また、各更新後に 1006 個のファイルを Web ホスティングにデプロイするのは少し面倒です...)
誰もが回避策のアイデアを持っていますか?