私はどちらかというとPrototype.jsライブラリをよく使ってきたのですが、最近はjQuery寄りになっていて、プラグインをいくつか作る機会が出てきました。今回は自分が参考にしたサイトなどを頼りにjQueryプラグイン作成方法をまとめてみたいと思います。 参考サイト：　jQuery を扱う: 第 3 回 中級レベルの jQuery: 独自のプラグインを作成する 内容はややデベロッパー向けですが、以下のWeb技術を扱った一連のドキュメント群も非常にためになります。 技術文書一覧 プラグイン作成のマナー 別に強制力があるわけではないですが、jQueryサイドで最低限守ってほしいという規則を載せておきます。 １、ファイル名はjquery.「あなたのプラグイン名」.jsとする。 例：　jquery.clickablecanvas.js ２、メソッドはjQuery.fnオブジェクトにアタッチし、

jQueryで要素を動かして印象的にする：via Crafting an Animated Postcard With jQuery 昨今Tori's Eyeのように要素をJavaScriptで動かしているサイトを多くみます。 今回はjQueryを使用して要素を動かす方法を紹介します。 via：Crafting an Animated Postcard With jQuery sponsors 使用方法 サンプルのようなアニメーションを作るには以下のようなhtmlを記述します。 使用するファイル一式はCrafting an Animated Postcard With jQueryからダウンロードしてください。 <div id="content"> <div id="sun"><img src="images/sun.gif"/></div> <div id="cloud1"><img s

スマフォ向けサイト最適化にも使えそうなブラウザ幅に応じCSSが切り替えられるJSライブラリ「Adapt.js」 2011年04月19日- Adapt.js - Adaptive CSS スマフォ向けサイト最適化にも使えそうなブラウザ幅に応じCSSが切り替えられるJSライブラリ「Adapt.js」。 見ているユーザによってディスプレイのサイズなんかはまちまちで、ブラウザのサイズも結構違いますね。 このフレームワークを使えば、幅が600〜800px は a.css、800〜1200px の場合は b.css のように使い分けるのが容易になります。 端末の違いなんかもCSSによって分けてしまえると、プログラム的な無駄な分岐を省けて綺麗に作れますね。 ここら辺の分岐を簡単な使い方で勝手にやってくれるのがAdapt.js。スマートフォン向けサイトなんかにも使えます。 iPhoneだと縦で大体320p

2008年10月08日22:31 JavaScript setTimeoutには関数オブジェクトを渡さないと無限ループになってヤバい 「setTimeout知らなくても許されるのは小学生までだよね(ﾟ∀ﾟ)ｱﾋｬﾋｬ」ということで、setTimeoutについて勉強しました。参考にしたのはこことかこことか。 例えば、こんな感じのjavascriptを書いたとします。 console.log("AAA"); setTimeout( function(){console.log("BBB")}, 10000 ); hoge(); console.log("CCC"); function hoge() { setTimeout( function(){console.log("DDD")}, 5000 ); console.log("EEE"); } これをFFで実行すると、こんな結果が得られます

Thomas Fuchs, author of the script.aculo.us user interface JavaScript library, a member of the Prototype core team and a Ruby on Rails core alumnus. Thomas Fuchs氏が6 easy things you can do to improve your JavaScript runtime performanceにおいてJavaScriptの実行パフォーマンスを改善するための6つのテクニックを紹介している。Thomas Fuchs氏はscript.aculo.usの開発者であるとともにPrototypeコアチームのメンバーも務めている。またRuby on Railsでコアチームで開発を担当していたこともある。 JavaScriptエンジン

jQueryを使って簡単にHTMLやCSSを変更したり、追加したりすることができます。今回は、HTML、CSSをjQueryで変更する命令についてご紹介します。jQueryを使用したJavascriptは、どのHTML要素を操作するか指定する『セレクター』と、操作する『処理』が基本です。今回も前回使用しました『ready関数』を使ってサンプルを交えてご紹介します。 テキスト HTMLで使用される『テキスト』をjQueryで制御するには『text()』を使用します。 変更 『text()』うを使用してテキストを変更するには『text()』の括弧の中に変更後のテキストを記述します。 Javascript $("p#first").text("テキスト変更後"); デモ 取得 『text()』の括弧内に何も記述しなければ指定したセレクターのテキストを取得できます。 $("p#first").t

【2024年8月】レンタルサーバーおすすめ10社を徹底比較！ 人気ランキングも PR 最終更新日：2024年08月16日

クロージャとは クロージャは、言葉で説明するのが大変難しい概念です。 あなたは、自転車の乗り方を、口だけで説明できるでしょうか？ あなたは、螺旋(らせん)の形を、言葉だけで説明できるでしょうか？ ずばり、できないでしょう。 しかし、自転車に乗ることはできますし、針金で螺旋の形を作ることはできるでしょう。 「クロージャ」もこれと同じです。 だから、Wikipediaのこんな解説を見ても落ち込まないでください。 クロージャ (クロージャー、Closure) は、プログラミング言語において引数以外の変数を実行時の環境ではなく、自身が定義された環境（静的スコープ）において解決する関数のことである。 理解できないですよね？ 私もそうでした。 クロージャを既に知っている人にしか、この文章は理解できないでしょう。 クロージャを作るのは難しくない しかし、説明するのは難しくても、作るのは意外と簡単。それが

jQueryのクリック処理について相談です。 リスト（li）内にあるaリンクをクリックすると、ダイアログボックスが出て クリックしたliに割り当てたid名を表示するようにしています。 以下のソースを書いたのですが、連続してリンクをクリックすると 複数ダイアログボックスが表示されたりid名が違ったりして、挙動がおかしいです。 ソースの指摘と改善方法をアドバイスしていただければと思います。 // Javascript $('#myList li').live("click",function(){ var id = $(this).attr("id"); $(this).find('.select').live("click",function(){ if(confirm('IDは'+id+'ですか？')){ return true; }else{ return false; } }); })