JavaScript」カテゴリーアーカイブ

JavaScript(ジャバスクリプト)に関する記事のカテゴリ。JavaScript(ジャバスクリプト)とは、HTML埋め込み型、オブジェクト指向、という特徴を持つ、クライアントサイド・スクリプト言語。HTMLやCSSなどと組み合わせることで、高度なウェブサイトを作れる。

サイズ変更可能ボックスの幅と高さの比率を指定

jQuery UI の Resizable プラグインを使った、ドラッグ&ドロップでサイズを変更できるボックスの、幅と高さの比率を指定には、aspectRatio オプションを使う。幅と高さの比率を指定しておくと、ボックスの大きさを変更しても、常に幅と高さの比率(縦横比率)は変わらない。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Resizable | サイズ変更可能ボックスの幅と高さの比率を指定 はコメントを受け付けていません

サイズ変更可能ボックスの最小サイズと最大サイズを指定

jQuery UI の Resizable プラグインによる、ドラッグ&ドロップでサイズを変更できるボックスの、最小サイズと最大サイズを指定する方法。最小サイズ指定は、minHeight と、minWidth オプション、最大サイズ指定は、maxHeight と、maxWidth オプションを使う。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Resizable | サイズ変更可能ボックスの最小サイズと最大サイズを指定 はコメントを受け付けていません

jQuery UI の Resizable プラグインによるサイズ変更可能ボックス

jQuery UI の Resizable プラグインを使った、サイズを変更できるボックス。ドラッグ&ドロップで、ボックスの幅と高さを変更できる。ボックスの右端、下端、右下端にカーソルを合わせると、カーソルがリサイズ用カーソル形状に変わる。ドラッグして動かすと、ボックスの幅と高さを変更できる。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Resizable | jQuery UI の Resizable プラグインによるサイズ変更可能ボックス はコメントを受け付けていません

選択結果を確認できる複数項目選択GUI

jQuery UI の Selectable プラグインを使った、複数項目選択 GUI で、選択した項目を表示する方法。項目をクリックし選択すると、文字色と背景色を反転させ、リストの上に、選択した項目名を表示する。「Ctrl」キーを押しながら複数選択しても、選択した項目名をカンマ区切りで表示する。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Selectable | 選択結果を確認できる複数項目選択GUI はコメントを受け付けていません

jQuery UI の Selectable プラグインによる複数項目選択GUI

jQuery UI の Selectable プラグインを使った、複数項目選択GUI。項目をクリックすると、項目を選択できる。選択した項目は、文字色と背景色を反転させ目立たせる。「Ctrl」キーを押しながら、項目をクリックすると、複数の項目を選択できる。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Selectable | jQuery UI の Selectable プラグインによる複数項目選択GUI はコメントを受け付けていません

ドラッグ&ドロップで並べ替える対象となる要素を指定

jQuery UI の Sortable プラグインの items オプションを使うと、ドラッグ&ドロップで並べ替える対象となる要素を指定できる。デフォルトでは、リストタグの li 要素が、並べ替える対象だが、items オプションを使うことで、任意の要素に変更できる。クラス名で指定すると、タグを入れ子にしても大丈夫。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Sortable | ドラッグ&ドロップで並べ替える対象となる要素を指定 はコメントを受け付けていません

格子状に並べたリストをドラッグ&ドロップで並べ替え

jQuery UI の Sortable プラグインを使い、格子(グリッド)状に並べたリストを、ドラッグ&ドロップで並べ替えられるようにする方法。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Sortable | 格子状に並べたリストをドラッグ&ドロップで並べ替え はコメントを受け付けていません

ドラッグ&ドロップで並べ替えるときのドラッグできる部分を指定

jQuery UI の Sortable プラグインの handle オプションを使うと、ドラッグ&ドロップで並べ替えるときの、ドラッグできる部分を指定できる。項目のボックスを並べ替えたいが、ドラッグできるのはボックス内の一部だけにしたい…そんなときに、役立つオプションだ。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Sortable | ドラッグ&ドロップで並べ替えるときのドラッグできる部分を指定 はコメントを受け付けていません

複数のリストの境界を越え、ドラッグ&ドロップで並べ替え

jQuery UI の Sortable プラグインの connectWith オプションを使うと、複数のリストの境界を越え、ドラッグ&ドロップで並べ替えることができる。いづれかのリスト内の項目を、他のリストへすべて移動しても、CSSで一行ほどのスペースを残せば、そこへドロップすることができる。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Sortable | 複数のリストの境界を越え、ドラッグ&ドロップで並べ替え はコメントを受け付けていません

ドラッグ&ドロップで並べ替えた順番を送信

jQuery UI の Sortable プラグインを使い、ドラッグ&ドロップで並べ替えた順番を、送信する方法。「この並び順を送信」ボタンを押すと、「この順番でよろしいですか?」という確認ダイアログが出現し、「OK」を選択した場合、項目IDを送信する。 続きを読む

カテゴリー: GUI, JavaScript, jQuery, jQuery UI, Sortable, フォーム | ドラッグ&ドロップで並べ替えた順番を送信 はコメントを受け付けていません

スポンサード リンク