今さら聞けないjQuery実行パターンまとめ :: 5509
なんとなく使っているだろう.ready()メソッドについて詳細に見てみましょう。 .ready()メソッド .ready()メソッドという呼び方がパッとしない人もいると思います。こういうのです↓ $(function(){ // .ready()が呼び出されたときに実行されるハンドラ }); jQueryを実行する際のおまじないみたいなものですね。これの中にjQueryコードを書いていくとページロード時（Documentの読み込みが完了時）に実行してくれます。 何気なく使ってる人も多いと思いますが、実際のところこれは何？ということで、少し掘り下げてみましょう。 .ready()を使う際の形式 jQuery APIによれば、以下の3つが.ready()として同じように使えるようです。 $(document).ready(handler) $().ready(handler) (推奨されていな
デザインがクールなタグクラウドを実装できるjQueryプラグイン「jQCloud」:phpspot開発日誌
DukeLeNoir/jQCloud GitHub デザインがクールなタグクラウドを実装できるjQueryプラグイン「jQCloud」 作ってみると意外と難しいタグクラウド。それを次のように美しく実装できるタグクラウド実装用プラグインです ワードのリストを次のように配列で渡してあげて初期化するだけです。デザインとかは全部やってくれるみたいです 文字の羅列だけをデザインする上に、毎回ワードが変わるわけなのでなかなかデザインが難しいところですね。 Web2.0と言われた２００５年当時は何処でも見る程よく使われていたインタフェースですが、CSS3を使ってrotateさせたりすることで今ならより進んだ面白い表現ができるかもしれませんね 関連エントリ 瞬時にタグクラウドが形成できるjQueryプラグイン「Jimpl Tag Cloud」 HTML5のcanvasを使ったアニメーションするタグクラウド
jQueryを使ったタブメニューの実装サンプルまとめ
**追記** この記事とは直接関係ありませんが、自作のタブプラグインを貼っておきます。 rin316/jquery.tab: jQuery tab plugin. **追記終わり** 仕事でjQueryを使ったタブメニューを作ったので忘れないようにメモ。 それぞれの挙動も比較しやすいように並べてみました。 今日が勉強初投稿の日！ 写真:新川通りで撮った桜。 まずはファイルの用意 下記リンクからダウンロード。 ・jQuery本体…Past Releases内→最新バージョンのMinified ・Download Builder | jQuery UI (このサイトで使っているui.tabs.zip) head内にリンクを張る ダウンロードしたファイルに対して、head内にリンクを張ります。 [html] [/html] さっそく使ってみる 本文にhtmlを追加。 [html] タブ1 タブ2
[JS]高性能で設置も簡単、ブラウザ枠いっぱいに背景画像を配置するスクリプト -bgStretcher
デモページ：Super Slider スライドのスーパー版で、斜め方向のスライドで画像を切り替えます。 bgStretcherの主な特徴 セットアップはシンプル 全てのモダンブラウザをサポート 画像は一枚だけでなく、複数枚にも対応 対応ブラウザ Internet Explorer 6, 7, 8, 9 Firefox 2, 3, 4 Opera 9+ Safari Chrome bgStretcherの使い方 Step 1: ファイルのダウンロード サイトの「Download」よりファイル一式をダウンロードします。 一式には必要なファイル全て（jqeury.jsも）が含まれています。 Step 2: 外部ファイル 外部ファイルを下記のように<head>～</head>に記述します。 <script type="text/javascript" src="../jquery-1.5.2.mi
作業の進捗状況を表すガントチャートを作成できる「jQuery.ganttView」
twitter facebook hatena google pocket 作業の進捗を表すのによく利用されるガントチャート。 これをJavaScriptで表示できるのがjQuery.ganttViewです。 sponsors 使用方法 jQuery.ganttViewからファイルをダウンロード。 <link rel="stylesheet" type="text/css" href="jquery.ganttView.css" /> <script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript" src="date.js"></script> <script type="text/javascript" src="jquery.ganttView.js"><
Ajax風にファイルをアップロードするjQueryプラグイン「Uploadify」の使い方 | JavaScript | かたつむりくんのWWW
Ajax風（？）なファイルのアップローダーは多々あります。その中でも、この「Uploadify」はかなり使いやすそうです。 画面遷移なしでファイルをアップロードできるのはもちろんのこと、アップロードの進行状況も見られたり、複数ファイルのアップロードにも対応していたりと、非常に良い感じです。また、アップロード完了後やファイルの選択後の振るまい、重複ファイルのチェックなど、色々とオプションの設定が出来るのも嬉しいです。 jQuery のプラグインということもあり、敷居も低い気がします。 まずは試してみる まずは、「uploadify - a multiple file upload plugin for jquery」からファイルをダウンロードします。 解凍したフォルダの中の「example」フォルダをサーバーにアップロードします。 これで準備完了ですので、exampleフォルダ内のindex
EasyUI - helps you build your web pages easily
Welcome to EasyUI EasyUI framework helps you build your web pages easily. GET STARTED What is EasyUI? easyui is a collection of user-interface components based on jQuery, Angular, Vue and React. easyui provides essential functionality for building modern, interactive, javascript applications. using easyui you don't need to write many javascript code, you usually define user-interface by writing so
[067] 管理画面カスタマイズの１ | WordPress experiment – twentyten customize-
WordPress の管理画面をカスタマイズする方法には色々あり、全てをまとめてご紹介することは難しいので順番にご紹介しようと思います。まず最初は全体の概要と 「５．jQuery でHTMLを置換する」 をご紹介します。 管理画面のカスタマイズ方法にはざっと、以下のような方法があるのではないでしょうか。 １．プラグインを使う ２．アクションフック、フィルターフックを使う ３．meta_box の追加や削除を使う ４．CSS で要素を変更したり非表示にする ５．jQuery でHTMLを置換する ６．リダイレクトで代替ページにとばす ７．WordPress コアファイルを変更する １．プラグインを使う まずはプラグインがあるかを確認します。こちらは詳しい方が大勢おられると思いますので詳細は割愛しますが、例えばカスタムフィールドテンプレートというプラグインひとつとっても様々な機能
第2回 jQueryの基本（お題編） | gihyo.jp
はじめに 第2回の今回からは本格的にjsdo.it -Share JavaScript,HTML5 and CSS-（以下、jsdo.it）を使ってJavaScriptを勉強していきたいと思います。毎回お題編と回答編に分けてやる予定で、お題編では基礎知識を解説してそれに関連した課題を出し、それをjsdo.itでつくってもらい、回答編で解説するというかたちで連載を進めていきます。 今回はjQueryの基本のお題編ということで、jQueryの基礎を解説したあと最後にお題がありますのでそちらを次回までにやっておくとより理解が深まるはずです。 jQueryってなに？ そもそもjQueryとはなんでしょう。まったく知らないという人もいれば名前くらいは聞いたことがある、いつもJavaScriptを書くときは使っている、さまざまだと思います。今回は初回なので念のためjQueryとな何なのかというところ
オドメーター風のカウントアップ機能をつくる
遊び 3 オドメーター風のカウントアップ機能をつくる プラグイン名:jodometer 作者:Jesus Carrera http://plugins.jquery.com/project/jodometer Option表示 実行結果を別窓で表示 © Copyright 2009 by semooh.jp
semooh plugin sample site
Index of Semooh jQuery Sample Site 画像 1.画像を切り替える（フェード） 2.画像を切り替える（フェード2） 3.画像を切り替える（サイズ、フェード） 4.画像を切り替える（スライド） 5.画像を切り替える（奥行き） 6.画像を切り替える（サイコロ） 7.画像を切り替える（シャッター） 8.画像を切り替える（カルーセル） 9.画像を切り替える（色々） 10.画像の一部分を拡大する 11.縮小した全景で画像を見る 12.画像をパノラマ風に表示する 13.画像を反射する 14.LightBoxを表示する 15.画像にマスク処理を施す 16.マウスオーバーで画像を拡大表示する 17.透過PNGをIE6でも表示させる スタイル 1.マーキーを滑らかに実装する 2.クリックできる範囲を広げる 3.要素の高さを最大のものに揃える 4.グラデーションを作成する 5.文
idTabs
Psst, here's beta copy of idTabs 3.0. Email me if you have questions. Version 2.2 Here's what's new. Changed option 'return' to 'change' Removes confusion with javascript's return Added ability to dynamically add idTabs The most requested feature Added 'selected' class option More freedom rules! Added ability to change defaults Now you can select no tab to be shown at start Bind idTabs to differen
JavaScriptライブラリ「jQuery」でカレンダーを作る「FullCalendar」
twitter facebook hatena google pocket JavaScriptライブラリの「jQuery」を使用してカレンダーを作ります。 via：FullCalendar - Full-sized Calendar jQuery Plugin sponsors 使用方法 FullCalendar - Full-sized Calendar jQuery Pluginからファイル一式をダウンロードします。 <link rel="stylesheet" href="fullcalendar.css" media="all"> <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="ui.core2.js"></script> <scr
jQuery の配列系のメソッドをメモ - てっく煮ブログ
JavaScriptjQuery は機能が豊富なので、しばらく使わないと忘れてしまう。ここでは、jQuery と配列の関係に絞って目的別に逆引きできるようにしておく。配列から jQuery オブジェクトを作成$ 関数に渡せばOK $([1,2,3]) NodeList のような配列っぽいものを渡しても解釈してくれる。 $(document.getElementsByTagName("div")) // $("div") と同じ ※内部的には setArray メソッドが呼ばれてるが、外から使うことは稀。jQuery を配列のように扱う要素数を取得するlength プロパティを使えばOK。 $("div").length // document.getElementsByTagName("div").length と同じ jQuery のメソッドを使って操作する限りは、適切に length
jQuery 日本語リファレンス
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
twitter-trackbacks-widget - Project Hosting on Google Code
Lazy Loader - Load HTML and Images on Window Scroll | jQuery Plugins
jQuery LazyLoad images in a hidden div
GitHub - RonnieSan/uploadify: A jQuery plugin for file uploads.
PARP