問題タブ [webkit-transform]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
google-maps - ウェブページを印刷するときにGoogleMapAPI V3キャンバスが印刷されないのはなぜですか？
あなたが提供できるどんな助けにも前もって感謝します！うまく機能しているように見えるマップツールを作成しました。地図、ドラッグ可能なルート、複数のウェイポイント、および完全で動的なdirections_panelを取得します。ユーザーがこのWebページを印刷して、map_canvasとdirections_panelを取得できるようにしたいと思います。テストでは、印刷プレビューにmap_canvasが含まれていましたが、途中のどこかで、Webページを印刷するとmap_canvasが表示されなくなりました。印刷時に表示するにはどうすればよいですか？
これが私のHTMLです。
更新：CSSをいじって、「position：relative」と「-webkit-transform：translateZ（0）;」を削除すると、マップが印刷可能になることがわかりました。#map_canvasから。残念ながら、これにより印刷されたページ全体が奇妙に見えます（マップが大きすぎて位置がずれています）。これを修正するために追加する必要のある別のタグまたはCSSはありますか？
css - Chrome でパースペクティブ CSS 変換を有効にしますか?
このスタイルを #board (灰色のもの) で使用すると
Firefox での表示:
しかしクロムでは：
必要なのは Firefox のものです。では、クロムで同じ外観を得るにはどうすればよいでしょうか?
html - Adobe AIR HTML+JavaScript アプリとハードウェア アクセラレーション
モバイルおよびデスクトップ用の HTML アプリケーションを開発しています。アプリケーションは、WebKit ベースの環境向けに最適化されています。レンダリング速度を向上させるために、ハードウェア アクセラレーション レイヤー (-webkit-transform: translateZ(0);などなど) を使用しています。
これは私の iOS デバイスでうまく機能します (PhoneGap aka Cordova を使用して「ネイティブ」アプリをパッケージ化します)。
Windows と OS X では、Adobe AIR 3.5 を使用して、キャプティブ ランタイム HTML/JavaScript ベースのアプリケーションをパッケージ化しています。他の多くのソリューション (Cordova for Windows 7 / OS X、TideSDK など) を試しましたが、これが (今のところ) 最良のソリューションであることがわかりました。
ポイントは、Adobe AIR での HTML レンダリングがハードウェア アクセラレーションではないように見えることです。これを経験した人はいますか？AIR HTML レンダリングでハードウェア アクセラレーション レイヤーを有効にする可能性はありますか?
どうもありがとう ：）
html - css @-moz-keyframesアニメーションがFirefox 18.0.1で機能しない
Firefox 18.0.1 で css @-moz-keyframes アニメーションが機能しない
私は以前のバージョンでこのアニメーションをチェックしました（バージョンの以前の番号を忘れました）、それは機能していました、
アニメーションはこちら
Firefoxのバグですか？
javascript - webkitTransitionEnd が起動しない
正確に何が起こったのかはわかりませんが、ある時点でこれが機能していたことは確かです。
イベントが発生していない (または、適切にキャッチしていない)
以下のフィドルを参照してください。ボックスの遷移が完了すると、アラートがポップアップするはずですが、アラートは表示されません。
css - ハードウェア アクセラレーションの可用性を確認していますか? （試験あり）
-webkit-transform、-webkit-perspective などを使用する CSS を作成しました。私の設計は、ハードウェア アクセラレーションが利用できるマシンでは問題ないように見えますが、そうでない場合は実際には使用できません。ハードウェア アクセラレーションの可用性を確認し、代替 CSS を提供するにはどうすればよいですか?
補足: chrome://gpu-internals/ を実行して、可用性を手動で確認してください。
css - CSS アニメーションとスピン遷移の同時実行
これにある種の回転トランジションを追加することは可能ですか? コードを div 宣言に追加して別のセレクターを作成しようとしましたが、どれも機能していないようです。
css - Safari (モバイル + デスクトップ) グループ化 CSS キーフレーム アニメーション
羽を除いて、空気中に浮かぶ泡を模倣する効果を Safari で作成するのに問題があります。要点を理解するために、いくつかのコードを省略しました。制作中のURLはこちらです。
アニメーション オブジェクトの Webkit スタイルは次のとおりです。
そして、一連のオブジェクトを作成するためのJavaScript。
Chrome または Firefox でリンクにアクセスすると、意図した効果が得られます。ただし、Safari (これもモバイルまたはデスクトップ) では、フェザーがスタックし、7 秒ごとにグループ内でのみアニメーション化されます。DOM に挿入されたらすぐにアニメーションを開始してもらいたいです。これに関するアイデアはありますか？
android - CSS -webkit-transform: translate() on Android Browser
iOS およびすべてのデスクトップ ブラウザーで成功したにもかかわらず、translate プロパティまたは -webkit-transform が Android ブラウザーで正しく動作していないようです。
私の「完全な」ソリューションは、次のような小さな jQuery 関数です。
これは次のように呼び出されます。
Android が同時に複数の css3 アクションのサポートを中断したことをいくつかの場所で読みました。ただし、このコードをすべてこの単純なダミー呼び出しに置き換えても、変換は行われません。
私はアンドロイドに特有の何か間違ったことをしていますか?