「Knockout.js/cssバインディング」の版間の差分
imported>Administrator 編集の要約なし |
imported>Administrator 編集の要約なし |
||
| 1行目: | 1行目: | ||
[[Knockout]]の'''cssバインディング'''とは、パラメーターの値に応じ、関連付けられた[[DOM]]要素のCSSクラスを追加または削除する[[Knockout/可視バインディング|可視バインディング]]のひとつである。 | [[Knockout.js]]の'''cssバインディング'''とは、パラメーターの値に応じ、関連付けられた[[DOM]]要素のCSSクラスを追加または削除する[[Knockout.js/可視バインディング|可視バインディング]]のひとつである。 | ||
なお、CSSクラス単位ではなく、style属性の個別の値のみを書き換えたい場合には[[Knockout/styleバインディング|styleバインディング]]を使うとよい。 | なお、CSSクラス単位ではなく、style属性の個別の値のみを書き換えたい場合には[[Knockout.js/styleバインディング|styleバインディング]]を使うとよい。 | ||
== パラメーター == | == パラメーター == | ||
cssバインディングの基本的な書式は以下のとおりである。 | |||
<source lang="html5"> | <source lang="html5"> | ||
<div data-bind="css: { CSSクラス名: 値または式 }">...</div> | <div data-bind="css: { CSSクラス名: 値または式 }">...</div> | ||
</source> | </source> | ||
cssバインディングはカンマ区切りで複数指定もできる。 | |||
<source lang="html5"> | <source lang="html5"> | ||
<div data-bind="css: { CSSクラス名: 値または式, CSSクラス名: 値または式, ... }">...</div> | <div data-bind="css: { CSSクラス名: 値または式, CSSクラス名: 値または式, ... }">...</div> | ||
| 51行目: | 51行目: | ||
== 関連項目 == | == 関連項目 == | ||
* [[Knockout]] | * [[Knockout.js]] | ||
** [[Knockout/可視バインディング|可視バインディング]] | ** [[Knockout.js/可視バインディング|可視バインディング]] | ||
== 参考文献 == | == 参考文献 == | ||