基本teachersjQueryUIをはじめる方は必見、超簡単サンプル集~その1~この記事は2013年7月22日に書かれたものです。内容が古い可能性がありますのでご注意ください。Tweet3.jQueryUIのサンプルスクリプトそれではjQueryUIのサンプルをいくつか作成してみましょう。全サンプルに共通する部分としてhead内で読みこむcssとjsファイルをまとめておきます。type="text/javascript"></script>※jquery-1.9.1.jsをjquery-ui-1.10.3.custom.min.jsより先に記述しておく必要があるので、注意しましょう。サンプルプログラムを実装していきます。今回は、インタラクティブな操作を行う機能「Draggable」「Droppable」「Resizable」「Selectable」「Sortable」のサンプルを作成していきます。表示要素をドラッグ操作できる「Draggable」。class="ui-widget-content"></div></body></html>では、このドラッグ要素(A)を別の要素Bの上にドラッグした時に要素Bにドロップする「droppable」機能を実装してみましょう。here</p></div></body></html>sample1の7行目を以下のように変更し、且つドロップを受けるボックスを用意しています。});});</script>赤いボックスを青いボックスにドラッグ&ドロップしたタイミングで青いボックスのメッセージが変わればOKです。次にボックスのリサイズを行う「Resizable」を機能を実装してみます。area</textarea></body></html>リサイズ可能なテキストエリアを実装してみました。エリアの右下をクリックしてエリアがリサイズできればOKです。