問題タブ [css-expressions]

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.

0 投票する
8 に答える
3766 参照

javascript - CSS 式を使用した IE6 のパフォーマンス

多くのクライアントに販売される Web アプリケーションを開発しています。準備ができ次第、製品を購入することを決定したクライアント (銀行) が既に 1 つあります。残念ながら、いくつかの誤解により、彼らが使用している唯一のブラウザーが IE6 であることがかなり遅れて明らかになりました。このアプリケーションは、IE7 より下のものをサポートする必要がないことを念頭に置いて既に開始されています。結果もかなり良好で、IE7/FF/Opera/Safari で十分に使用できます。Chrome ではテストしていませんが、問題はほとんどないと予想されます。残念ながら、結局のところIE6の要件があります...

アプリケーションはまだあまり開発されておらず、デザインもほぼ問題ないので、変更はそれほどひどいものではありません。それでも、多少の手間はかかります。

IE6 の優れた点は、非標準で非常に役立つ 2 つの機能をサポートしていることです。1 つ目は条件付きコメントです。これにより、IE6 専用の CSS/JS ファイルを含めることができます。2 つ目は CSS 式です。つまり、次のようなものです。

本質的には、CSS 値を JavaScript 式にバインドします。これにより、IE6 がネイティブにサポートしていない多くの CSS 機能を簡単にエミュレートできるようになり、負担が大幅に軽減されます。

残念ながら、IE は JavaScript のパフォーマンスで悪名高いです。これらの表現を使いすぎると、速度が遅くなるのではないかと心配しています。また、銀行がどのコンピュータを使用しているかもわかりません。それはかなり大きなものなので、すべての支店で多種多様なものを期待しています. 単純な数学、三項演算子、およびこの要素/親要素のプロパティの確認など、あまり使用することはないと思います。それでも、IE6_override.CSS ファイルにはこれらが数十個あります。

これは問題になる可能性がありますか?

追加:ああ、これは私が恐れていたものでした. わかりました、欠点を回避するために他のハックをどれだけ使用できるか見ていきます. ありがとう、人々!

0 投票する
3 に答える
512 参照

css - IEのCSS動的プロパティを使用する必要がありますか?

IEのCSS動的プロパティを使用する必要がありますか?

IE8+はこれらをサポートしないと読みました。

これを処理するための最良の戦略は何ですか?

0 投票する
6 に答える
3859 参照

javascript - !important ルールは IE の CSS 式で使用できますか?

まず、CSS 式は多くの点で無効であり、間違っていることを知っ!importantています。これは、特殊なケースの stylesheet用です。

要するに

私の質問は... CSS 式で!importantフラグを設定する方法はありますか?

たとえば、これは機能しません:

[編集: 以下の MarmaladeToday のコメントに感謝]. これも機能しません:

これを他の方法で行うことはできますか?


詳細に

私が実際にやろうとしているのはinherit、IE6 & 7 の値を模倣することです。これは機能します。

!importantしかし、フラグも設定したいのですが、これは機能しません:

!importantJavaScript では、要素のstyleオブジェクトを介して設定できないことは承知しています。たとえば、これは機能しません:

ただし、要素の属性を介して設定すること可能です:!importantstyle

それで... CSS式はstyleオブジェクトとの相互作用に限定されているので、私が達成したいことは不可能です-または、式が要素の属性に影響を与える方法、または!important他の方法で渡す方法はありますか?


バウンティの開始

これまでのところ明確な答えがないので、バウンティを開始します。

inherit !important理想的には、CSS 表現の有無にかかわらず、IE6 および IE7 で模倣するための CSS ベースのソリューションを探しています。(投稿する前に、提案が機能することを確認してください)。

少なくとも、これは不可能だと言っている信頼できる参考文献へのリンクは、この一連の考えを休ませることができることを意味します -!importantルールでの CSS 式の使用について言及しているものは見たことがありません。

0 投票する
3 に答える
7074 参照

css - CSS式をまだサポートしているブラウザはどれですか

ブログから:

CSS 式の基本的な考え方は、CSS コード内のプロパティに計算値と動的値を持たせることです。これは非常に便利です。簡単な例として、IE 6 で max-width 動作を実装することができます。

それらについて読んだのはこれが初めてです。IE は以前は CSS 式をサポートしていたようですが、IE8 では廃止されました。他のどのブラウザがまだそれらを使用しており、それらは一般的に良いものですか、それとも悪いものですか?

これを入手したブログ投稿には、代替手段は Javascript であると書かれていますが、CSS の方がサポートされているため、Javascript よりも優れていると思いました。

0 投票する
2 に答える
1637 参照

javascript - Internet Explorer の CSS 式とフィルターおよび Javascript の比較

CSS 式と CSS フィルターの違いは何ですか?

どちらもページ速度に悪いですか?

他のブラウザーでは純粋な CSS で何かを達成できるが、IE では CSS 式または CSS フィルターまたは Javascript によってのみ可能である場合。ページの速度が気になる場合は、常に Javascript を使用する必要があります。

FilterJavaScript は、CSSやExpressionソリューションよりもレンダリングが高速になりますか?


ペッカの回答後に更新

わかりましたので、CSS 式は避けるべきです。それは明らかです。

フィルターについて知りたい

フィルタの例

IE6 で PNG 透明度を取得し、IE 6,7,8 でいくつかの CSS 3 効果を取得するには、CSS IE を使用できます。Filters

http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/

また、利用可能な Javascript の代替手段もいくつかあります。

Javascript は CSS Filter よりもレンダリングが速くなりますか?

注:プロパティfilterは有効な CSS ではありません

0 投票する
1 に答える
404 参照

css - 複数の CSS 式 IE

入力タイプがチェックボックスの場合にのみ、ドロップ シャドウ フィルターを適用したい。以下は機能しています

ただし、 this.type=='checkbox' を含めたいと思います。このようなもの

これは動作しません。

0 投票する
3 に答える
84444 参照

html - CSS 式

CSS 式は非推奨であり、使用すべきではないことをどこかで読みました。私はそれらについて聞いたことがなかったので、見てみることにしました。スクロールしても、フローティング要素を画面上の同じ場所に保持するコード例を見つけました。

これは、ページの下部に「共有バー」などがあるサイトを思い出させました。

そう...

  1. これが彼らのやり方ですか?
  2. この状況でエクスプレッションを使用しても問題ありませんか?
  3. そうでない場合は、何を使用すればよいですか?
  4. 式が役立つ他の興味深い/役立つことはありますか?
0 投票する
3 に答える
438 参照

javascript - CSS式またはJavaScript?

javascriptだけを使用できるのであれば、CSS式を使用するのが理にかなっているのではないかと思います。

どちらが良いですか、それとも速いですか?

CSS式は無効なjsで機能しますか?

0 投票する
2 に答える
631 参照

javascript - CSS - cssで「ワンタイムCSS表現」を行う方法は? (例: IE の max-height / max-width)

私は通常、SO で質問をする前にプログラミングの疑問を解決しますが、答えを見つけることができないように見えるのはこれが初めてです....だから...ここで、数時間後にサイトへの最初の質問に行きますこれを解決しようとする:

¿ ワンタイム CSS 式を作成する方法は?


なぜワンタイム式なのか?: TEST のようなものを実行する場合 (IE6 と IE7 では警告が何度も表示されるので注意してください...):

式は時間の終わりまで評価されます...そのため、2°の記事で説明しようとしているスタイル自体を上書きするなど、一度だけ実行する方法を理解したいのですが、実際には取得できませんそれは働くために....


この記事で読むことができるように:

http://developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_6/

式が繰り返され、パフォーマンスの問題になる可能性があります...

次に、この記事:

http://vacskamati.blogspot.com/2008/10/one-time-execution-of-ie-css.html

これは、これを解決しようとしていることがわかった唯一のものです...しかし、私はそれを正しく理解できないようです....

私がやろうとしていることは... IEで「最大幅」と「最大高さ」をエミュレートすることです...私はFFを知っており、他の人はCSSで直接それを行うことができます..何とかそれを機能させる必要がありますIE6およびIE7で...

外部でJSを使用できることはわかっていますが、コードでわかるように... PHPの値を入れようとしています...そのため、式に直接制御を加えて、一度だけ自動的に実行する必要があります他の場所で JS 関数を記述する必要はありません....これは非常に単純なはずだと思います...しかし、私はそれを得ることができます...とにかく...私のコードはこれに似たものです....:

うーん...うーん、それが基本的な考え方です...私はすでに上記の記事が説明しようとしているさまざまな方法を試しました.私はすでに男にメールを送ろうとしましたが、うーん、可能な答えを待っている間に、この問題を明らかにします. SOコミュニティにとって、単純かもしれないと思う何かに対する答えを見つけることができないのは非常に奇妙です...

だから今のところ...私が知っている限り、EXPRESSIONはそれ自体を繰り返します..元のコンテンツが400pxより大きい場合はSCROLLを取得します....しかし、それ自体が繰り返されることはわかっています...「アラートを送信した場合()" それは常に表示されます....そう....また、1回限りの表現を実現するにはどうすればよいですか...したがって、IEはmousemoveまたはアクションを評価しません....

前もって感謝します =) (そして、私の奇妙なインデントされたコードで申し訳ありません...=P )

0 投票する
2 に答える
20682 参照

css - divの高さを設定するCSS式

CSS式に基づいてdivの高さを設定したい。

基本的に、ビューポート幅の%(たとえば90%)として設定する必要があり ます。次のことを試しましたが、機能していません。

私はこれを行うクロスブラウザの方法を検討しています(IE7 +、FF4 +、Safari)