問題タブ [mobile-webkit]

Appleは、iOSで使用するWebKitおよびJavaScriptCoreエンジンを（部分的に）オープンソース化しています：http ：//www.opensource.apple.com/release/ios-433/

iOS上で独自のバージョンのJavaScriptCoreを構築、使用、および出荷することはすでに可能です。しかし、WebKitのレンダリングエンジンで同じことを行うことは可能ですか？iOSのUIWebViewは非常に制限されています。欠落している重要な機能は、JavaScriptCoreJavaScriptコンテキストオブジェクトにアクセスすることです。これがないと、同じJSエンジンを共有しながら、JavaScriptCoreで直接実行したり、Webビューでコードを実行したりすることはほぼ不可能です。そのため、JavaScriptコンテキストを公開する独自のWebKitベースのWebビューを構築することに興味があります。

この点でまだ何か仕事をしているプロジェクトはありますか？コンパイルされたWebビューライブラリは、アプリに同梱するには大きすぎますか？

ありがとう！

ネイティブの iPhone アプリや Android のネイティブ アプリで一般的に見られるトランジション (ページ全体が左または右にスライドするスライダー効果など) を使用する簡単な方法を探しています。

私のWebアプリケーションのWebページ間の遷移は、jQuery Mobile、Wink、iUiなどのフレームワークを使用して実行できることを知っています.

また、私のアプリケーションには、スクロール可能なコンテンツを含む固定フッターと固定ヘッダーが必要です。jQuery Mobile で試してみたのですが、コンテンツのスクロール効果は良いのですが、固定ヘッダーとフッターのレンダリングはあまり良くありません。

そのため、代わりにiScroll 4を使用しますが、jQueryモバイルがDOMなどで再生されるため、jQueryモバイルを使用してトランジションのみを行うことはできません。これにより、divの配置内でいくつかの問題が発生します

私は iUI を試してみましたが、jQ mobile ほど「広く」ないように見えますが、それでも Web アプリの完全なフレームワークです。しかし、私は現在トランジションのみを探しています..

JavaScriptフレームワークを使用せずに、これらの「完全なWebページ」遷移を実現する方法はありますか? また、iUI などのフレームワークは、すべてのページを 1 つのみに配置します (jQuery Mobile はこれは優れていません)。複数の div 内にそれらを分離します。これは、iScroll で問題になる可能性があります。

最高の方法は、別々の html ページ間でこれらの遷移を実行できるようにすることですが、それが可能かどうかはわかりません (つまり、AJAX ワールド テクニックを使用しないことを意味します)。

Webkit (Android、iDevices..) を使用する最新のデバイスのみを対象としています。

助けてくれてどうもありがとう

私は私たちのサイトでjqueryベースのライトボックスを実行していますが、すべてが主要なデスクトップOSブラウザーで正常に機能しています。

しかし、モバイルSafari（iPhoneとiPadの両方）（そしておそらくAndroidデバイスでも）では、これらのブラウザーのスケーリング機能が原因で問題が発生します。

これは、オーバーレイ要素を挿入し、そのオーバーレイの上にいくつかの画像を表示する「通常の」ライトボックスです。

これが私がやろうとしていることです：ウィンドウ全体をカバーしたいので、オーバーレイを取得してそれらの値に設定します$(window).width()。$(window).height()

通常のデスクトップブラウザではスケーリングされないため問題ありませんが、スケーリングデバイスでは、これらの値が768x946であり、デスクトップ上のページの実際の幅が1400を超えるため、オーバーレイが狭すぎたり短すぎたりします。 。

はい、スケーリングをオフにすることはできますが、サイトは細かく縮小されているように見えるので、それを避けたいと思います。

したがって、質問は次のようになります。ページが縮小されたときに、ウィンドウまたは本体要素の実際の拡大縮小されていない幅をどのように取得しますか？

よろしくお願いします:-)マーティン

Android デバイスの問題をデバッグしようとしていますが、最近ブラウザーの about:debug の追加設定を発見しました。ただし、言及されている「ナビゲーションキャッシュのダンプ」や「V8キャッシュのダンプ」など、不明なオプションがいくつかあります。情報を探すのにかなりの時間を費やしましたが、見つけることができる唯一のものは、User-Agent 文字列を変更する機能です。

about:debug メソッドに関するドキュメントはありますか? または、これらのダンプに何が含まれていて、どこにダンプされているかを教えてもらえますか? ブラウザのキャッシュを表示する機能は、今の私にとって非常に便利です;)

助けてくれてありがとう。

私は現在、CSS 3 と HTML 5 で iOS UI を模倣するためのプライベート フレームワークに取り組んでいます。多数の色付きのグラデーション ボタンを含むほとんどのウィジェットを作成しましたが、ボタンがクリックされる青色のグラデーションを追加するのに苦労しています。

次の例を試しました: button:focus, button:active,button:hoverしかし、何も機能していないようです。Mobile WebKit でボタンをクリックしたときに表示されるのは、デフォルトの灰色のボックスだけです。誰かが私を正しい方向に向けることができるのだろうか.

基本的に、私はこれをしたい：

それが理にかなっていることを願っています！jQueryを使用して「クリック」したときにボタンにクラスを追加しようとしましたが、やはり何も起こりません。私の質問は、ユーザーが Mobile WebKit の要素をタップしたときに呼び出される正しい擬似クラスは何ですか?

CSS3 の要素にトランジション変換がありますが、アニメーションを実行するたびに、アニメーションに関係する要素の 1 つがアニメーションの間常に非表示になっているようです。

CSS、HTML、および JavaScript コードは次のとおりです。

CSS

JavaScript:

基本的に、アニメーションはdiv.control-con、チェックボックスのステータスに応じて、全体を前後に移動します。Chrome と Safari ではすべて正常に動作しますが、Mobile Safari で実行すると、何らかの理由でアニメーションの実行時に要素span.offと要素が表示されません。span.on

どのスパン要素が非表示になるかは、アニメーションの方向によって異なります。問題のスクリーンショットを次に示します。span.offアニメーションが完了するまで、 が表示されないことがわかります。

また、参照用にこれを jsFiddle に入れました: http://jsfiddle.net/kShEQ/

phonegapを使用してjQueryモバイルアプリを構築しています。Unsafe JavaScript attempt to access frameiframe (おそらく webkit) でページにアクセスしようとしたときの問題があります。フレーム化されたページと親ページの両方がローカルにあり、これは で始まりfile:///ます。I know where is a question like this Unsafe JavaScript attempts to access frame in Google Chrome But I cannot passing the --allow-file-access-from-files switch at startupon my phone.And I also want to deploy toインターネット上の私のアプリ.これを解決する他のオプションはありますか? ブラウザ上で何も変更する必要がない方が良いはずです。ありがとうございます。

現在、WebKit デバイスで使用するためのプライベート フレームワークを開発しています。私は一連のリストビューを作成しました。これにhover、ユーザーが何かをタッチスタートしたときのクラスを適用しています。これを追加するために使用しているjQuery / JavaScriptコードと、一致するクラスへのCSSは次のとおりです。

そしてCSS：

Chrome (または一部のデスクトップ Webkit 対応ブラウザー) で表示すると、マウスの位置が画面の遷移間で移動しない場合、新しい画面のリスト要素がホバーされるという事実を除いて、これは期待どおりに機能するようです。:hover疑似クラスが起動されているため、これは当然のことです。

ただし、iPhone の Mobile Safari で同じ動作が発生するとは予想していませんでした。以下に、いくつかのスクリーンショットとシナリオの簡単な説明を示します。aList Views 要素 (内の要素) を 1 回タップliし、画面から指を離します。div別のリストを含む新しいリストが表示されます。div現在表示されている新しいものを何もタップせずに、触れていないのに、2番目liのクラスはです...hover

これをデバッグしたり、モバイル WebKit でこれが起こっている理由を解明したりできる人はいますか? HCIが貧弱なので、非常に迷惑です。問題を修正するために次の行を追加しようとしましたが、喜びはありません:

助けてくれてありがとう、そして取り乱してごめんなさい！

私はjquery-mobileアプリに取り組んでおり、少し問題が発生しました。アプリのページの「トップに戻る」穏やかなスクロールに jquery の animate() を使用したいと思います。

次のコード スニペットは、私のテスト ブラウザーの 1 つを除くすべてでうまく機能します。デスクトップの Chrome と Firefox、iPhone の Safari、Android の Firefox Beta はすべて優れています。デフォルトの Android ブラウザー (webkit-mobile IIRC) は、アニメーションが完了するとアンカーに戻ります。

誰でも、a) Android ブラウザがスクロールバックする原因、および/または b) 回避策を提案できますか? それが違いを生む場合、私が現在テストしているデバイスは Android 2.3.2 を実行しています。

Android 2.2 および 2.3 のネイティブ ブラウザで、device-widthCSS メディア クエリとwindow.screen.width両方のレポート サイズが Web ページ ドキュメントとスケーリングに基づいて適用される問題を確認しました。

例: 1:1 のスケーリング、幅 960 ピクセルのページは、適切なデバイス幅 (たとえば、320 ピクセル) を表示します。

例:フィットスクリーン スケーリング、幅 960 ピクセルのページ、960 ピクセルのデバイス幅を不適切に報告する

したがって、適切なビューポート メタ タグ コンテンツがあれば、予測可能に見えます。しかし、私の場合、meta タグに頼ることはできません。ビューポートのメタ タグに関係なく、Android で信頼性の高いデバイス幅の測定値を取得するための回避策を使用する人はいますか? 他のプラットフォームは、すべてのスケーリングでこれを正しく報告します。

参照: http://code.google.com/p/android/issues/detail?id=11961