jQueryを使って文字を選んでボックスの背景色を変える

ネットショップの注文フォームとかで色を指定してもらう時に、色を名称で選んでもらうだけではなく、商品の色が変わったり出来ないかな?と思って作ってみました。

注文フォームで選んだ内容が送信されないといけないので、色の選択はラジオボタンを使用します。だけども、ラジオボタンの丸いのを隠したかったので、CSSで消してラベルのみを表示しました。

サンプルはこちら

html

ラジオボタンを使用することで、疑似セレクタの「:checked」が使えるようになるので、チェック状態の時にそのチェックボタンの属性値を取得し、cssで設定するようにしています。

にほんブログ村 IT技術ブログへ にほんブログ村 IT技術ブログ WordPressへ にほんブログ村 IT技術ブログ Webサイト構築へ

投稿者: おーあえ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください