jQuery(179)

178follower
goto_jp さんのアバター 289views

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 さんのアバター 410views

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

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

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

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

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

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

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

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

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

サンプルはこちら。 See the Pen neiGb by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. IE9以前では対応しておらず、また現在でもブラウザごとに微妙に表示に差のあるpla... 2014年5月30日
goto_jp さんのアバター 3,439views

jQueryでタブメニューを作る

サンプルはこちら。 See the Pen Basics of jQuery – Tab UI by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. タブUIを作るjQueryプラ... 2014年5月29日
goto_jp さんのアバター 2,483views

jQueryで常に縦幅100%のレイヤーを作る

サンプルはこちら。 See the Pen ldCqh by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. こちらのサンプルウィンドウ表示だと分かりづらいので、こちらのリンクから別ウィンドウ... 2014年5月28日
goto_jp さんのアバター 278views

jQueryの基礎:兄弟要素を条件付きで操作する

サンプルはこちら。 See the Pen qugry by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 前回兄弟要素の操作を紹介しましたが、その兄弟の中から条件に合致する対象のみ操作でき... 2014年5月27日
goto_jp さんのアバター 1,493views

jQueryの基礎:兄弟要素を操作する

サンプルはこちら。 See the Pen hBbKu by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. HTML的に同じ階層にある要素、親でも子でもない要素は兄弟要素と言います。IDやク... 2014年5月27日
goto_jp さんのアバター 12,813views

jQueryの基礎:要素の位置座標を操作する

サンプルはこちら。 See the Pen Basics of jQuery – Set of coordinates by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. まず左... 2014年5月26日
goto_jp さんのアバター 6,866views

jQueryの基礎:表示切り替え系トグルの種類

サンプルはこちら See the Pen Basics of jQuery – Type of toggle by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 表示のON/OF... 2014年5月26日
goto_jp さんのアバター 1,555views

jQueryの基礎:独自HTML属性を使って汎用的なトグルボタンを作る

サンプルはこちら See the Pen Basics of jQuery – Generic Popup toggle by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. 前回... 2014年5月23日
goto_jp さんのアバター 1,261views

jQueryの基礎:ポップアップウィンドウのトグル

サンプルはこちら。 See the Pen Basics of jQuery – Popup toggle by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. ボタンクリックで表... 2014年5月23日
goto_jp さんのアバター 869views

jQueryの基礎:クラスを付与or解除する

サンプルはこちら See the Pen Basics of jQuery by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. テキストクリックでそれぞれ異なる動作をしています。 HTML... 2014年5月22日
goto_jp さんのアバター 534views

jQueryの基礎:ID、クラス、HTMLタグにフックさせる

jQueryの本当に基礎から紹介します。 サンプルはこちら。 See the Pen Basics of jQuery by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. テキストをクリッ... 2014年5月22日
harada さんのアバター 1,155views

JQuery:指定してある特定のclassをhoverで外す

ページ表示時からオンマウスの動きを明示しておきたいときや、最初だけ目立たせたいときなどに使えるかと思います。表示サンプルはこちら。 Javascript <script type="text/javascript&quo... 2014年5月16日
harada さんのアバター 949views

jquery.tile.jsプラグインで列ごとに要素の高さを揃える

要素の中身によってdivの高さが違ってしまうと見栄えがよくないことがあります。jquery.tile.jsプラグインを利用することで、列ごとに高さをそろえることができます。ダウンロードはこちら HTML(1列に3つずつ配置する場合) &... 2014年5月14日
harada さんのアバター 587views

ブラウザの幅からはみ出た要素を切り捨てる

複数の要素をブロック状に並べていて、ブラウザの幅からはみ出した場合要素をはみ出して表示するのではなく、非表示にして常に綺麗に並べる方法です。 Browser size aware content scaling を利用します。 HTML... 2014年5月13日