jQuery(173)

173follower
goto_jp さんのアバター 531views

jQuery:イージング(Easing)でアニメーション表現を高める

サンプルはこちら。 See the Pen nvlBb by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. ボタンを押すことでそれぞれのイージングタイプに応じた動作を上のバーに反映させます。... 2014年6月17日
goto_jp さんのアバター 1,448views

jQuery:格納・展開できるメニュー

サンプルはこちら。 See the Pen oqkLj by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. メニュー下の「narrow」をクリックすることでメニューの格納・展開ができます。 ... 2014年6月12日
goto_jp さんのアバター 5,889views

jQuery:一定の位置までスクロールしたらメニューをfixedさせる

サンプルはこちら。 See the Pen xqhkg by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 左のメニューが画面上部に来た時点でposition:fixedになり、画面内に常に... 2014年6月11日
Yukimi Sato さんのアバター 600views

jqueryの「.slideToggle」を使ってクリックで表示/非表示を行う

$('#btn').on('click', function () { $("#openArea").slideToggle(); }); <a id="bt... 2014年6月11日
goto_jp さんのアバター 829views

jQueryUI:「input type=number」を擬似的に作る

サンプルはこちら。 See the Pen Eurik by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 数値入力欄の右の上下ボタンより一定の数値を増減させられます。 HTML5からの「... 2014年6月9日
goto_jp さんのアバター 898views

jQueryUI:階層メニューUIをつくる

サンプルはこちら See the Pen xdJEr by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. リストから階層メニューを簡単に作れます。 JavaScript $(functi... 2014年6月6日
goto_jp さんのアバター 1,004views

jQueryUI:ラジオボタンをボタンセットにする

サンプルはこちら See the Pen lBpku by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. HTML <div class="group"> ... 2014年6月6日
goto_jp さんのアバター 643views

jQueryUI:ツールチップを表示させる

サンプルはこちら。 See the Pen vuaif by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. カーソルを置いた際にツールチップを表示させます。注釈や説明の表示に役立ちます。 ... 2014年6月5日
goto_jp さんのアバター 791views

jQueryUI:入力欄にオートコンプリート(入力補助)機能をつける

サンプルはこちら。 See the Pen fkoxL by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. a~bで始まるいくつかの単語を候補に入れています。jQueryUIでこのようなオー... 2014年6月5日
goto_jp さんのアバター 537views

jQueryUI:アコーディオンUIの生成

サンプルはこちら。 See the Pen fGysD by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. jQueryUIでアコーディオンUIを簡単に作ることができます。jQueryUIの... 2014年6月4日
watanabe さんのアバター 260views

jQueryで指定要素のコピーを作成する方法

$(selector).clone(); clone()によってselectorで指定した要素のコピーを作成することができる。 append()やprepend()で指定要素の追加を行う場合にも、clone()でコピーされた要素を用いる... 2014年6月4日
goto_jp さんのアバター 891views

jQueryUI:ダイアログの生成

サンプルはこちら See the Pen tHfer by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. jQueryUIで簡単にダイアログ表示を行うことができます。 HTML <... 2014年6月4日
goto_jp さんのアバター 746views

jQueryUI:ドラッグ&ドロップの制御

サンプルはこちら。 前回はドラッグする方法を紹介しましたが、それだけでは意味がありません。ドラッグした後にドロップする時の挙動も含めて一つのUIになります。 JavaScript $(function() { $('.t... 2014年6月3日
watanabe さんのアバター 6,697views

jQueryで指定要素の子要素を削除する方法

$("selector").empty(); $(“selector”).children().remove();でも同じように選択した要素の子要素を削除できますが、empty()はempty(... 2014年6月3日
goto_jp さんのアバター 285views

jQueryUI:要素をドラッグ可能にする

サンプルはこちら。 See the Pen LhAEr by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. jQueryのプラグイン「jQueryUI」のドラッグコンポーネントを利用していま... 2014年6月3日
goto_jp さんのアバター 328views

jQuery利用例:HTMLコンテンツを挿入する

サンプルはこちら。 See the Pen Bgyct by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 各ボタンより対象の前後と中にHTMLを挿入できます。 JavaScript $... 2014年6月2日
Yukimi Sato さんのアバター 405views

「PageSlide」の右スライド時を左スライド時と同じような挙動にする

40行目付近 //右スライドのマージンをleftからrightに変更 //f["margin-left"] = "+=" + d, f["margin-right"] = &q... 2014年6月2日
Yukimi Sato さんのアバター 6,236views

横から出てくるJqueryスライドメニュー「PageSlide」

jsはこちらからダウンロードできます。 http://srobbin.com/jquery-plugins/pageslide/ body閉じタグの直前にJqueryと一緒にjsを配置。 配布サイトでは1.8系でしたが、1.11でも動作は... 2014年6月2日
goto_jp さんのアバター 411views

jQueryでplaceholder(フィールドの初期値)を表現する(改良版)

サンプルはこちら。 See the Pen dJbDp by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 前回の「jQueryでplaceholderを表現する」を扱いやすく改良しました。... 2014年6月2日
harada さんのアバター 1,034views

jQueryを利用してクリックでdivを引っ張りだす

表示サンプルはこちら。右側のグレイのブロックをクリックすることでdivを引っ張りだします。 CSS body { overflow-x: hidden; } #slideout { background: #EEE; ... 2014年5月30日