jQuery(179)

178follower
goto_jp さんのアバター 1,733views

レスポンシブ&スワイプ操作に対応したスライダーjQueryプラグイン「bxSlider」

PCでは無限スライダー表示、スマホではスワイプ操作に対応したスライダーになってくれる「bxSlider」は、非常に簡単にサイトへ加えられます。 ファイルの読み込み <script src="//ajax.googleapis.... 2014年9月19日
goto_jp さんのアバター 1,721views

jQuery:アコーディオンメニュー改訂版

See the Pen jquery accordion menu by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. jQueryでアコーディオンメニューを作る 以前作った上記アコーディオ... 2014年9月5日
harada さんのアバター 201views

jQueryを利用して特定のIDで括られた要素を非表示にする

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript"> ... 2014年8月11日
Yukimi Sato さんのアバター 782views

jQueryを使わずにタブ切り替えをjsで実装のタブCSS

jQueryを使わずにタブ切り替えをjsで実装する のタブ部分のcss指定になります。 selected付与時はタブがハイライトになるようにしてあります。 #tab{ padding: 0 10px; border-b... 2014年7月28日
Yukimi Sato さんのアバター 357views

検索ボックスにフォーカスしたら括っているDIVの枠線の色を変える

<div class="search"> <form> <input type="text" class="searchText" value=&qu... 2014年6月25日
goto_jp さんのアバター 15,078views

jQuery:スクロールするレイヤー内で指定位置までスクロールさせる

サンプルはこちら。 See the Pen nBidH by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. ページを開いた時点で「Caption 4」を表示するようにしており、上にあるリンク... 2014年6月18日
goto_jp さんのアバター 538views

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

jQueryUI:ダイアログの生成

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

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

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

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

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