問題タブ [computed-style]
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.
html - 特定の計算された CSS スタイルの原因を調べる
計算さ<div>
れた高さプロパティが 633px になる Web ページがあります。これは、インラインかどうかに関係なく、どのカスケード スタイル シートにも設定されておらず、JavaScript にも設定されていません。コード内のあらゆる場所を検索しましたが、番号 633 はどこにも表示されません。必要な高さを設定することでこれを解決できstyle="height: 420px;"
ますが、IEはこれをデフォルトで他のブラウザーでも取得する633pxにオーバーライドするようです。Google Chrome と Firefox/Firebug の両方で、div の実際のコンテンツの高さが 633 ピクセルに近くないことを確認しました。この計算された高さの理由を知る方法はありますか? 完全を期すために、Google Chrome が のスタイル プロパティとして報告するものを次に示し<div>
ます。
前もって感謝します。
編集:
問題の div には 2 つの div が含まれており、1 つの div には 1 行のテキストが含まれ、1 つfont-size: 16px;
の div には高さが 367px あります。
別の編集:
さて、これの原因がわかりました。メイン div に含まれる 2 番目の div には、1 つの画像と、position: relative; top: -335px;
. Internet Explorer は、この要素が空白になるスペースを保持します。それを回避する方法はありますか?
最終編集:
解決しました!フローティング div の内容を でposition: relative
2 番目の divにラップしましたposition: absolute
。これにより、メイン画像の下の空白が取り除かれます:) 最終的な HTML は次のようになります。
c# - C#でHTML要素の実際のマージンを取得します
C#コードで、IHTMLElementsマージンが占める実際のピクセル数を取得する必要があります。そのスタイルとcurrentStyleメンバーを調べましたが、関連する部分がnullであるか、「auto」に設定されています。
インターネットを検索すると、javascriptでgetCurrentStyle関数が表示されますが、c#コードでこれらの数値が必要です。
明らかに、私はjsとhtmlとすべてに少し慣れていません...
それで、c#コードの要素マージン(またはそれに関する他の測定値)に使用されている実際の計算されたピクセル数を取得する方法はありますか?
追加するのを忘れました:これは、当面の間、InternetExplorerでのみ使用されます。
javascript - JavaScript で計算されたフォント ファミリを取得する
これはこの質問のフォローアップです。
私はCKEditorのコンポーネントに取り組んでいます。これは、現在選択されているフォント ファミリ/サイズの値を常に表示するフォント ドロップダウン メニューの微調整バージョンであり、それらがどこで定義されていてもcomputedStyle
、consorts を使用しています。
他の質問でわかるように、フォント サイズの決定はクロスブラウザーで機能するようになりました。現在、fontFamily
属性の操作に問題があります。私の一般的な「計算されたスタイル」関数は、定義された完全なフォント文字列のみを返します。
設定をフォント ファミリ ドロップダウンのエントリと一致させるために必要なのは、チェックしている DOM 要素の実際のフォントの固定フォント名です。
少なくとも最も一般的な Web フォントについては、どうにかしてこれを行うことはできますか?
javascript - プロトタイプJSの単純なgetComputedStyle?
document.defaultView... やその他のプロパティをチェックせずに、PrototypeJS の要素の計算されたスタイルを取得する簡単なクロスブラウザの方法はありますか? ...コードが次のようになるように
PrototypeJs は、計算された寸法を返すgetDimensions
、-Width
、およびメソッドを提供しますが、境界線、背景などの他の計算されたスタイルを取得する方法はありません。-Height
getComputedStyleのスタンドアロン実装をいくつか見つけましたが、それを行う PrototypeJS のパッチ/プラグインがあるのではないでしょうか?
javascript - IEでrgbとして計算された背景色を取得します
次のコードを使用して、IEでRGB背景色を取得しようとしています。
これはfirefoxのようにrgbカラー値を返しません。私には役に立たない「buttonface」を返します。
javascript - 幅の検出:jQueryの自動
私はjQueryを使用して要素の幅を取得していますが、明示的な幅(および高さ)が指定されているかどうかを示すことができれば、それを好むでしょう。
これにより、クライアントの画面で占めるピクセル数に関して、divの暗黙の幅が警告されます。幅が欠落しているか、width: auto
jQueryを使用して検証できるように設定されている場合、方法はありますか?
つまり、上記の例では整数を返す代わりに、またはのいずれauto
かを返しますundefined
。または、代わりに、isAuto
関数に相当するものはありますか?
javascript - オペラで計算された境界半径を取得する
このコードを使用して、いくつかの要素の計算された境界半径の状態を取得しようとしています:
変数「myElement」は、border-radius が「20px」に設定された HTML 要素です。(動的に設定するか、CSSを使用して設定するかのいずれか)
「temp」変数には、borderRadius (「20px」) 文字列が含まれます。このコードは IE、FF、および Chrome で動作しますが、Opera では、"border-radius" または "border-bottom-right-radius" を取得しようとすると空の文字列が返され、それ以外で呼び出すと "undefined" が返されます。
この HTML 要素の境界線はすべて同じであるため、border-radius または border-bottom-right-radius を取得しても問題ありません。
半径を取得するためにどのスタイル プロパティ名を呼び出せばよいかわかりましたか?
ご協力いただきありがとうございます。
javascript - 計算されたスタイルを取得するにはどうすればよいですか?
誰かがスクリプトで私を助けてくれますか..またはの値を取得する方法
計算されたスタイルシート(webkit)から。IEが違うことは知っています-いつものように。iframe(クロスドメイン)にアクセスできません—必要なのは高さ/幅だけです。
必要なもののスクリーンショット(赤で囲んだ部分)。これらのプロパティにアクセスするにはどうすればよいですか?
ソース
私が得た最も近いものはこれです
これにより、「自動」であるHTML要素の実際のスタイルがわかります。これは、iframedドキュメントに設定されているものと同じです。
すべてのブラウザがスクロールバーの計算と要素値の検査に使用する計算スタイルを取得するにはどうすればよいですか?
Tomalaksの回答を使用して、Webkit用のこの素敵なスクリプトを作成しました
また
結果150px
と同じ
そこで、頭に「brshtml」のIDを追加してもらいました。要素を簡単に選択できるようになるかもしれません。Webkitの検査でhtml#brshtmlが表示されますが、を使用して選択することはできませんgetelementbyid
javascript - VIDEO 要素の計算された幅スタイルを確実かつ一貫して取得するにはどうすればよいですか?
コンソールには常に「300px」が表示されますが、明らかに、探している値は「640px」です。その console.log 呼び出しで setTimeout を 100 ミリ秒の遅延で使用すると、正しい「640px」値がコンソールに表示されます。
ただし、setTimeout は使用したくありません。正確に計算されたスタイル値を取得する「適切な」方法はありますか?
javascript - 書き直された CSS 計算スタイルの問題 (間違ったページ レイアウト)
HTMLElement.setAttribute メソッドを介してスタイル属性を変更する方法で、CSS を書き直しています (理由は聞かないでください)。この問題は、意味をなさないスタイルを計算したときに発生することがあります。たとえば (最も頻繁に発生します)、div の親は、計算されたスタイルで、子の div 要素よりも高さの値が小さくなっています。これにより、ページの目的のレイアウトに問題が発生します。CSSを書き換えるアルゴリズムを変更するのは簡単ではありません。実際には非常に難しいので、問題の原因とそれを解決するための最も適切な方法を知っている人はいますか?
私の仮定は、どういうわけか変更の一部が適用されていないため、css パーサーに値を再計算させる必要があるということです。誰もそのような問題に遭遇しましたか?