サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
jQuery でのプログラミングの、基本的なことからプラグインを作るところまで、初心者の頃につまずいた部分を中心にまとめてみました。公式ドキュメントなどで使われている、少し難しい印象の専門用語も織り交ぜながら書きました。jQuery でWebデザインのパーツを作るときの注意書きという感じです。 Webサイトを作るとき、私的にはとってもよく使っている jQuery。jQuery を勉強しだしたころは、自分の書いたコードが動いたりするのが、とっても楽しくて嬉しかった覚えがあります。私はあまりJavaScript でのコーディングが得意ではないので、今でもよく jQuery を使ってコーディングしてます …。 以前：CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました という記事を書いたのですが、今回はその復習 & jQuery
サイトに紙を折ったような効果を加えるプラグイン「oriDomi」を紹介します。 jQueryプラグイン「oriDomi」DOM（Document Object Model）に折り紙のような効果を、ということで「origami + dom」 → 「origamidom」 → 「oriDomi」というプラグイン名になったのかな？ このプラグインを使えば、指定した要素がぐにゅぐにゅと屏風のように折れ曲がった効果を加えることができます。オプションでは、折れ曲がるアニメーションスピード、折れ曲がり方などさまざまな効果を指定できます。スゴイ！ デモでは、背景を屏風のように折り曲げてみました。 「oriDomi」のデモ ソース（HTML + jQuery）<!DOCTYPEhtml> <html> <head> <meta charset="utf-8"> <title>OriDomi - jQuer
var a = [1,2,3,3,2,2,5]; // 重複を削除したリスト var b = a.filter(function (x, i, self) { return self.indexOf(x) === i; }); // 重複のみをリスト var c = a.filter(function (x, i, self) { return self.indexOf(x) !== self.lastIndexOf(x); }); // 重複を検出したものを重複しないでリスト var d = a.filter(function (x, i, self) { return self.indexOf(x) === i && i !== self.lastIndexOf(x); }); console.log(a); // [ 1, 2, 3, 3, 2, 2, 5 ] console.log
tubular, a YouTube Backg... / BigVideo.js - The jQuery... / jQueryで背景に動画をフルスクリーンで表示す...他...全3件
2022-07-14WebpackベースのVueプロジェクトのビルド環境バージョンアップの作業記録2022-07-13 動的サブセッティング下でのWebフォントのCanvasへの適用方法2022-04-12 アップロード処理の周辺実装のざっくりまとめ 2020-10-16 セッション切れ時のフロント側の制御について 2020-10-10 Code Splitting と非同期コンポーネント 2020-07-30 Enum の代わりに使う union 型 2020-07-09 Redux Toolkit の EntityAdapter をさわってみる 2020-06-04 Redux Toolkit の AsyncThunk をさわってみる 2020-05-28 Redux Toolkitをさわってみる 2020-04-08 foreverとAutomator.appでMac起動時にH
ブログネタ：JavaScript に参加中！ 忘れそうなので覚書〜JavaScript で配列なんかをイテレーション処理する時は、for を使うのが一般的。 ●JavaScript の書き方 for (var i=0, numArity=arrHOGE.length; i<numArity; i++) { (なんか処理); } jQuery を使ったときは、イテレーションのために each を利用できる。 ● jQuery の書き方 $(arrHOGE).each( function(i) { (なんか処理); } ); 便利だねー。 ■ continue /break のやり方 さて、for でグルグル回している処理を 「その時だけパスする」 や 「途中で止める」 ということをしたい。 そんな時もある。 にんげんだもの そのためには、continue やbreak を用いる。 ●
あれだけ苦戦したInstagramのAPIですが、ものすごくカンタンに利用できるプラグインがありました。しかも、このプラグインは、タグを指定することができます。ググり方が悪かったんですかね？昨日検索したときには出てこなかったんですが… InstagramAPIを使ってタグで絞った画像を表示する方法 では、さっそくタグで絞った画像を表示する方法を紹介します。まずは、InstagramのクライアントID（CLIENT ID）を取得するのに、開発者登録をしてください。 Instagram Developer Documentation 次に、jQueryのプラグインをダウンロードします。 potomak/jquery-instagram @GitHub これで、準備完了です。次は、コードです。JavaScript [cc lang=”JavaScript”] [/cc]HTML [cc
« Back toGitHub Repo Purpose Clingify is a jQuery plugin that allows you to easilycreate “sticky” or “fixed” headers, navs, and other page elements. Once you scroll past the targeted element, the plugin will toggle aCSS class that gives the element a fixed position, pinningit in place on the page. Features There are many other sticky plugins out there, but here are a few reasons to consider Cl
SidrThe best jQuery plugin forcreating side menus and the easiest way for doing your menu responsive You will be able tocreate multiple sidrs on both sides of your web to make responsives menus (or not,it works perfectly on desktop too).It usesCSS3transitions (and fallbacks to $.animate with older browsers) andit supports multiple source types. Get startedLike any other plugin, you must inc
フォームのリセットといえばこれ。 <input type="reset" value="リセット" /> しかしこれは各フォームのデフォルト値に戻すだけで、もともと何か値を持っていた場合、空欄の状態にはなりません。 （とあるフォームにて） そこでjQueryで各フォームを空欄・未選択にできるような処理を書いてみます。 その際、hiddenだけは空欄にしないようにしてみます。 $(".clearForm").bind("click", function(){ $(this.form).find("textarea, :text, select").val("").end().find(":checked").prop("checked", false); }); こんな感じになります。 DEMO ラジオボタン が選択されていても。 なにかチェックされていても。 テキストエリアでも。
Hello. I'm Yuki Iwanaga, a software engineer pursuing beauty in both design and engineering
What doesit do? jPages is a client-side pagination plugin butit gives you a lot more features comparing to most of the other plugins for this purpose, such as auto page turn, key and scroll browse, showingitems with delay, completely customizable navigation panel and also integration with Animate.css and Lazy Load. Apart from allits features, the main diference for the other pagination plugins
jQueryのイベントハンドラはコールバック関数の最初の引数にイベントオブジェクトを渡します。イベントオブジェクトの clientX プロパティと clientY プロパティによってマウスカーソルの位置を取得することができます。 イベントオブジェクトを操作するために関数にイベントオブジェクトを渡すためには、次のように引数にイベントを指定します。 [javascript] function(e){ // } [/javascript] 例えば、イベントオブジェクトの target プロパティはイベントを発行した DOM 要素への参照を返します。 次のコードは、イベントが発生しているオブジェクトを取得して DOM 要素のID 名（ #contents ）を表示させます。 [javascript] $(document).click(function(e) { var ele = $(e.tar
2012年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年目立ったのは、やはりレスポンシブ、そしてCSS3アニメーションでしょうか。 スライダーやギャラリー系もレスポンシブ・アニメーション対応、ナビゲーションやPinterst風のレイアウトなど、多くのプラグインにそれら二つの要素が組み合わさっています。 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 ナビゲーション関連 レイアウト関連 レスポンシブ関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
