問題タブ [dynamic-css]

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 投票する
3 に答える
600 参照

html - DOMの属性+兄弟のCSSルール

私が持っているのは、他のいくつかのフィールドセットを含む1つのフィールドセットを持つフォームです。フィールドセットごとに、ユーザーは凡例の横にあるチェックボックスをオンにして、そのフィールドセットを展開できます(少なくとも理論的には)。効果に純粋なCSSを使用してみるのはクールだと思っていましたが、DOM内の2つの要素の位置に基づいてルールを作成する方法に夢中になっています。HTMLは次のとおりです。

最初、このアイデアは少しハックっぽく見えましたが、w3cバリデーターを実行し、凡例に入力を埋め込んで渡されました。したがって、javascript / jqueryを使用した後は、自分が得ているものを取得できると確信していますが、古いブラウザーでサポートされていない場合でも、少なくともCSSでそれを行うための概念実証は必要ありません。

私はこのルールを試しました:

しかし、運がありません。私が使用している両方のブラウザー(Chrome、FF 3.5)が、input:checked + ul単に入力の後にulが続く場合に実行できることを、はるかに簡単なテストで確認しました。また、両方のルールがある場合は色が切り替わります(簡略化されたバージョン)。

ただし、チェックされた要素が凡例タグ内にあり、ULの直接の兄弟ではない場合に、ULを参照する方法があるかどうかはわかりません。「チェックされた入力を含む凡例の兄弟...」と言う方法はありますか?

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

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

php - phpとjavascriptを使用して動的CSSを生成する

cssで動的に変化する背景画像に基づいてツールチップを生成したいと思います。これは私のmy_css.phpファイルです。

このcssを使用するために私は追加しました

javascriptコードの私のhtml<head>タグで。背景画像を動的に生成するために、「index」のさまざまな値を渡すことを考えています。誰かがJavaScriptからそのような値を渡す方法を教えてもらえますか?を使用してツールチップを作成しています

このcreateElementを呼び出す前に、背景画像を設定する必要があると思います。

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

javascript - IE7+の動的スタイルシートに@importステートメントを追加する

IEの@importステートメントで動的スタイル要素を追加する際に問題が発生しました。これを試して:

これはFF/Chromeで機能しますが、IEでは機能しません。認識しているようですstyle.styleSheets.importsが、インポートしたスタイルシートは適用されません。これはバグですか、それとも制限ですか?

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

ruby-on-rails - Rails で動的 CSS を作成するにはどうすればよいですか?

Rails で動的 CSS を作成する最良/最も効率的な方法は何ですか。サイトの管理領域を開発しています。ユーザーがプロファイルのスタイル (主に色) をカスタマイズできるようにしたいと考えています。これも保存されます。

Rubyスクリプトをcssファイルに埋め込むだけですか?ファイル拡張子を css から変更する必要がありますか?

ありがとう。

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

javascript - Internet Explorer の親ウィンドウの動的 CSS

ウィンドウに動的 css ファイルを追加するのが好きです。私はそれのためにこのコードを構築します:

code>

FireFox と Chrome では正常に動作しますが、Internet Explorer 6,7 (まだ 8,9 をチェックインしていません) では、次の JavaScript エラーが発生します: 「無効な引数」 この行で: parent.document.getElementsByTagName("head")[0].appendChild(fileRef);

クロスドメインセキュリティが原因ではないかと思っていたので、親ウィンドウに次の行を追加します。 "document.domain = '127.0.0.1';"

しかし、それは助けにはなりません

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

css - firefox、chromeでcssのようなjspを扱う際の問題

複数の組織で使用する Web アプリケーションを作成しています。これには、どの顧客が自分のページを使用しているかに応じてカスタム スタイルが必要です (ページはさまざまな企業の「ブランド」になっています)。

基本的に、原色、背景色、会社のロゴ画像などの情報を保存するデータベースがありますが、これらはすべて私のサイトを使用しているユーザーによって異なります。

誰かが私のサイトに来ると、スタイリング情報を調べて、「ブランド」という名前のパラメーターとしてセッション スコープに入れます。

次のようなことを行う brandCss.jsp という jsp があります。

次に、<head>私のページのタグで、CSS ファイルであるかのようにJSP にリンクします。

Spring フレームワークを使用して、/brandCss のリクエストを brandCss.jsp ビューにマップし、このリクエストが JSP をビューとして返すようにします。

これは IE でうまく機能します。誰かが私のページにアクセスすると、私のサーバー コードがオフになり、表示する必要があるブランディング (スタイリング) 情報を見つけて、それを私の JSP にスプラットし、それが css ファイルとして扱われます。

ただし、Firefox/Chrome では、私の brandCss.jsp スタイルシートは使用されません。私のページは JSP を正しくプル ダウンし、IE とまったく同じ情報を取得しますが、何らかの理由でブラウザがスタイルを無視することを選択します。

これがなぜなのか、または Firefox が私の JSP を CSS のように扱うようにする方法を知っている人はいますか?

0 投票する
5 に答える
6757 参照

php - PHPを使用してNight & Dayの背景を変更しますか?

私はtumblrページに取り組んでいます。HTML ページには 2 つの異なる背景があり、昼の背景を午前 7 時から午後 8 時まで表示し、夜の背景を午後 8 時から午前 7 時まで表示します。

私はこれをphpで行うことにしましたが、phpに関してはまったくの初心者です。私の友人は、私が使用できるサンプルコードを送ってくれました。しかし、私はそれをどうするかわかりません。助けてくれませんか。

これがサンプルコードです。

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

javascript - 時刻に基づいて背景を変更する(javascriptを使用)

さて、私はそれが何時であるかに応じて背景として使用したい2つの異なる背景.jpgを持っています。晴れた背景を午前7時から午後8時まで、夜の背景を午後8時から午前7時までにしたい。

リモートのhtmlファイルで作業していて、背景とグラフィックを実際のhtmlファイルとは別のサーバーに保存しています。分離して外部スタイルシートに移動した背景コードを含むbodyセクションを除いて、ほとんどのcssはhtmlファイルにあります。私は2つの別々のスタイルシートを作成しました。1つは昼のbg画像付きで、もう1つは夜の画像付きです。これは、夜のcssスタイルシートにあるボディcssです。

うまくいくと思ったJavaScriptコードを書きました。しかし、そうではありませんでした。の真下に配置しましたが、まだ機能しませんでした。なぜうまくいかなかったのですか?背景を切り替えられるようにしたいだけです...時間に敏感です。

ここに全体のhtmlコードがあるので、皆さんは私がjavascriptコードを配置した場所を見ることができます(私はjavascriptコードを更新しましたが、それでも機能しません。

0 投票する
5 に答える
372 参照

dynamic-css - なぜ動的CSSはもっと人気がないのですか?

私は通常、より多くのバックエンドのものに取り組んでいるので、以前はそれについて本当に考えたことはありませんでしたが、昨日、友人のためのサイトで作業していました。動的に生成されたサーバー側。

CSSの制限を回避するためのJavaScriptソリューションについて話している人がいますが、CSSを動的に「ハードコーディング」できないのはなぜですか。

それを考えた後、調べてみたところ、いくつかの例がありましたが、トンではなく、StackOverflowでもここで言及されているのを見たことがなかったので、私が最初に思いついたのではないことを知っています。

ページが読み込まれる前にjavascriptを使用して要素のサイズを変更する場合と比較して、これには欠点がありますか?私が知っておくべき他の潜在的な落とし穴はありますか?

私はDjangoでそれを行っていますが、質問はほとんどフレームワーク/言語に依存しません。

ここでdynamic-cssタグの質問を調べたところ、かなりクールに見えるRubyの{less}が見つかりましたが、全体として、サーバー側で生成されたcssファイルについてはあまり話されていません。

編集:私が動的CSSで意味することの意図について混乱している人もいるかもしれません。ユーザーのコンテンツなどに基づいて変化するという意味ではありません。これは、画像を中央に配置する方法について私が見つけた例です。

それはすべて素晴らしいですが、それはcssであなたの画像のサイズを知ることを意味します。さらに、サイズの異なる画像に対して異なるエントリを意味します。高さと幅が可変で、画像のサイズがサーバー側で決定された場合、より一般的で再利用可能になります。

それが役立つ場所は他にもあると思いますが、cssをあまり使用していなかったので、動的cssでうまく機能した最初の例です。

さらに、パフォーマンスが問題になった場合は、少しの作業で適切にキャッシュできると確信しています。

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

ruby-on-rails - データベース情報に基づく動的 CSS

データベース内の要素数に基づいて CSS スタイルを動的に変更する方法を知りたいです。

ユーザーは特定の数の列を選択でき、選択した列の数によって列の幅が決まります (明らかに、選択した列が多いほど、各列の幅が狭くなり、ページ全体で水平方向に均等に配置されます。

どうやってこのようなことをしますか?