問題タブ [viewport]

長いドキュメントのどの部分が現在表示されているかを知るにはどうすればよいですか?

たとえば、私の html に 1,000 行が含まれている場合
1
2
3
...
999
1000

ユーザーが500行目を表示している中央付近にいる場合、「500\n501\n502」などを取得したいと思います。

明らかに、ほとんどのシナリオはこれよりも複雑ですが、私の要件は、現在ブラウザーのビューポートに表示されているテキストを見つけて、現在のテキストに適したステータス値を表示できるようにすることです。

ありがとうマーティン

一部の要素に指定されたサイズよりも小さいサイズにビューポートを縮小すると、背景色が予期しない動作をするという問題が発生しています。スクロール バーは正しく表示されますが、背景は期待どおりではありません。ビューポートが同じかそれ以上の場合、背景は意図したとおりに動作します。Firebug を使用してページ要素を検査すると、body要素内のコンテンツが伸びていても、要素が伸びていないように見えます。背景がこのように動作する原因は何ですか?

関連する html と CSS であると思われるものを提供しましたが、省略したものがある場合はお知らせください。

縮小されたビューポートの例

拡大ビューポートの例

CSS

HTML

これは、FF、IE、およびSafariで正常に動作するextjsシングルページアプリケーションです。

iPhoneでこのextjsアプリを表示または使用するには、いくつかの問題があります。extjsパネル/ウィンドウは、通常の画面のようにサイズ変更されません。ユーザーがズームアウトすると、拡大している表示領域が空白になります。画像の例を以下に示します。

• Iphoneはextjsのコンボボックスを認識しません。
• 下にスクロールできません。

ビューポートの問題：主な問題はビューポートにあります。iPhoneでは正しくスクロールまたはズームされません。

サイトの HTML タグに CSS 境界線があります。iPhone で表示すると、幅の一部として境界線が尊重されず、コンテンツと側面の間に 10 ピクセルのギャップがあるのとは対照的に、div の一部が重なり合っています。画面の。メタ ビューポート タグを使用しました

すべてが完全に整列するようになったため、これはうまく機能しましたが、サイトを横向きモードで表示すると、サイトが中央に配置されず、左揃えで開始されるため、スクロールするまでサイトの半分しか表示されません.

サイトをランドスケープ モードで表示したときに、サイトのレイアウトを中央に配置するにはどうすればよいですか?

iPadなどのモバイルデバイスで、position：fixedがサポートされている場合にのみ機能する機能を無効にしたいと思います。ユーザーエージェント文字列を使用せずにこれらのデバイスを検出する方法はありますか？その理由は、iPad、iPhone、iPod、Androidなどの検索はなるべく避けたいからです。

Safari を使用する iPad では、次のページに移動します: http://ifelse.org/projects/errors/viewport/test.html

これはソースです：

viewportポートレート モードで 1030 ピクセルの が完全に表示されるこの画像のようになります。

1. ブックマーク アイコン(+)をタップします。
2. ホーム画面に追加をタップ
3. ブックマークが作成されます。ブックマークを開くと、Web ページがフルスクリーンの webapp モードで開きます。

viewportタグは基本的に無視されます。私は、さまざまなピクセル値を使用したデバイスと混合ピクセル値を訴えるさまざまなバリエーションを試しました。何もない。

それで...これはバグですか、それとも機能ですか？

これがAppleの意図的なものである場合、それは本質的に、実際の幅が768pxである必要がある見栄えの良いWebアプリを適切に開発することを意味します...？

jquery scrollTo プラグインによって駆動される 1 ページの Web サイトがありますが、これは私の場合は問題ではないと思います。問題は1ページのデザインにあるようです。タブをクリックすると、フォーカスできるものにタブがジャンプするため、デザイン全体が台無しになります。これには、現在のビューポート領域の外にある場所が含まれます。
実際、最初のフォーム フィールドをクリックした後、#contactForm div 以外にタブをフォーカスさせたくありません。タブはそれにフォーカスできますが、ハッシュ "#contact" がビューポート内にある場合のみです。そのようなことを実現する方法はありますか、それとも、ビューポート領域外のコンテンツを扱っている 1 ページのデザインが常にタブ/フォーカスによって台無しにされますか?

たぶん、いくつかのアイデアがその問題をもう少しよく理解するのに役立つかもしれません

最大縮尺を設定し、方向を前後に回転すると、Web ページが電話の中央に配置されません。

したがって、このコードを使用して

margin: 0 auto; の CSS 効果を模倣するにはどうすればよいですか。

図とそれへの参照を含むLaTeXドキュメントがあります。

hyperref パッケージを使用して、結果の PDF でハイパーリンクを取得します。ただし、図へのリンクはキャプションに移動し、図自体は表示されません。キャプションを一番上に移動せずに、代わりに図の先頭に移動するにはどうすればよいですか?

UIWebViewのコンテンツを画面に合わせようとしています。私は2つのアプローチを試しました。まず、ロードされたhtmlのビューポートメタタグを使用してビューポート幅を設定しようとしました。

このアプローチは、シミュレーターと電話を4.2に更新する前に機能しました。

また、htmlを表示するUIWebViewのscalesPageToFitをYESに設定しようとしました。

どちらのオプションも機能しません。document.documentElement.clientWidthで示されるように、幅は480に設定されます。

何か案は？