スムーズにスクロールしないjQueryプラグイン「jDTScroll」 - Rewish
ページ内リンクでスクロールをスムースにするスクリプトは良くありますが、アレってもっとスムーズにスクロール出来ないのかなーとか思いますよね。僕は思います。 もっとスムーズにするのは僕には難しいので、普通のスムーススクロールがスムーズに感じられるように、スムーズにスクロールしないjQueryプラグインを作りました。 ダウンロードとデモ jdtscroll.js デモを見る 導入方法 1. jQueryとjDTScrollを読み込む <script src="jquery.js"></script> <script src="jdtscroll.js"></script> 2. 実行する $() で対象にする要素を指定します。ページ内リンクなのでフラグメント識別子が付いてるっぽいアンカーを指定するのがいいですね。 jQuery(function($) { $('a[href^="#"]').jd
第7章 「プラグインの作成」
jQueryが他のライブラリと最も異なるのが「拡張可能」な点です。これはプラグインという形でjQuery自体に機能を追加することができます。このプラグインによる拡張は非常に大きな意味があります。通常、ライブラリにない機能は自分で関数を定義して利用する事が多いでしょう。ただ、この場合作成した関数を他のプロジェクトに流用するのが難しかったり、関数名の衝突（オブジェクト名の衝突など）も配慮しなければいけません。 jQueryのプラグインの場合、このような心配はありません。jQuery自体に機能を追加するので関数名の衝突はありません。ただ、既存のjQueryに用意されているメソッド名を使ってしまうと上書きされ動作が変わってしまうので注意が必要です（機能が不足している場合は不具合がある場合は書き換えが可能というメリットもあります）。 それでは、実際にプラグインを作成してみましょう。jQueryでプラ
はてなブログ | 無料ブログを作成しよう
2025年5月のパフェ記録 今更ながら5月のパフェ記録です いろんなフルーツのパフェを食べました 宮原 Kazu Bake エンドウ豆とトウモロコシの初夏パフェ 醤油メレンゲ／パルミジャーノレッジャーノ／マンゴーとパッションフルーツのシャーベット／黒ゴマアイス／トウモロコシのグラニテ／えんど…
透過PNGや角丸などをIE6や7でも実装出来るJavaScriptのメモ - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 IE6のPNG透過や6、7での 角丸、ドロップシャドウを実装 するjsライブラリのまとめです。 同じ用途でもライブラリによっ て良し悪しだと思いますので、 備忘録的にメモ。 もうIEはいいよとも思いますが、現実そうも行かないのはもどかしいですね。万能では無いですけど、作業工数を減らせるならjsに頼ってもいいと思います。そういう訳で、透過の問題や角丸、ドロップシャドウを実装してくれるjsのメモ。 IE7.js IE6以下でもIE7と同じようなXHTML / CSSの解釈をしてくれます。要DOCTYPE 宣言。 IE6以下をWeb標準に準拠させるライブラリ『IE7.js』 DD_belatedPNG.js IE6でも透過PNGを実装できるライブラリ。class名等を指定
jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog
来週は私が夏休みなので更新はない予定です。agoです。 最近、人にjQueryを解説する機会があったので、昔を思い出してjQueryを使い始めた頃に感じる疑問を書いてみたいと思います。 1 そもそも何で使うの？いまでも困ってないよ 作成する内容にもよりますが、慣れると使用しない場合に比べて記述するコード量が3分の1程度まで減ります。 また、変数、条件分岐、繰り返しが減るのでバグが発生しにくくなります。 2 何か特殊なことができる？ 結局できることは変わりません。 jQuery自体JSで書かれてますし、記述の自由度もJSの制約に制限されます。 3 何が難しいの？ 文法がややjQuery的になります。 参考 jQuery言語入門 jQuery自体のコード量は少ないのですが、独特の記述法が多く慣れるまで多少時間がかかるかもしれません。 また、CSS Selectorの知識はほぼ必須です。 特にマ
【ハウツー】MS製Ajaxライブラリが2つ同時リリース! 強化点と性能を早速チェック (1) Ajax Libraryの新構文 | エンタープライズ | マイコミジャーナル
Microsoft Ajax Library (Preview 6)と Microsoft Ajax Minifier 10月15日(米国時間)、Microsoft本社のDeveloper Platform部門Corporate Vice Presidentを務めるScott Guthrie氏は、自身のブログ「ScottGu's Blog」においてASP.NETチームが最新のMicrosoft Ajax Library (Preview 6)をリリースしたとアナウンスした。 Microsoft Ajax LibraryはMicrosoft Source License for ASP.NET Pre-Release Componentsのもとで公開されている、JavaScriptベースのクライアントサイド・フレームワーク。クロスブラウザで動作し、.NET Frameworkライクな型を踏襲
テキストボックスのフォーカス時に文字列を全部選択するJavaScript - 小さい頃はエラ呼吸
検索窓などのテキストボックスにフォーカスがあたった際に、検索窓内の文字列を全部選択してあげるインタフェースは、細かなことですが親切でとても良いと思います。Firefoxに組み込まれている検索窓にはこの機能が実装されているようですが、本家Googleには、実装されていません。 どういうときに便利かというと、検索キーワードを変えて、何度も何度も検索する場合に、毎回Ctrl + Aで全部選択して、検索語句を削除して、また新しく入力してとやらなければならないのは、結構大変です。このCtrl + Aの操作をサイト側でやってあげることで、検索キーワードの削除もコピーペーストも格段に行いやすくなります。 テキストボックスのフォーカス時に文字列を全部選択する 以下は、テキストボックスのフォーカス時に文字列を全部選択するサンプルです。(textBoxfocus.html) <html lang="ja">
文書ツリーを多数回変更するときはDocument Fragmentを経由する (agenda)
「文書ツリーを多数回変更するときは、直接行なわずにDocument Fragmentを経由してくれ」という話。 一度DOMの実装を書いてみるなり、書こうとしてみるなりすれば分かる。DOM文書ツリーの変更、特にHTML文書におけるそれがどれだけの要素に影響を与えるかが。Document Fragmentの何が良いかといえば、例えば「View」から切り離されていることが挙げられると思う。DOM実装に依存するし想像でしかないけれども、文書ツリーに直接何らかのノードを加えたり削除したりすると、表示スタイルの計算にリソースを多少なり消費するが、Document Fragment中のノード群を操作する限りスタイルは関係ない。操作が完了した後に実際の文書ツリーに一回だけ変更を加えるなら、スタイルの計算も一回ですむ。文字列連結を何度も繰り返すか、それとも文字列の配列を一回だけjoinするかの違いを連想して
javascriptを@importのように一つのjsファイルで読み込む - AirNX 開発者ブログ
javascriptを多用するといくら外部化していても<head>〜</head>が散らかってきます。 こんな風に↓ <head> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/yuga.js"></script> <script type="text/javascript" src="js/outline.js"></script> </head> そこでcssの@importのように一つのファイルを読み込めば、 同時に他のファイルも読み込んでくれるようにする方法です。 手順はとても簡単でdocument.write()を使います。 document.write()はjavascript内にhtmlを書く時に使用します。 読
数値のみを入力可能にする - JavaScript
サンプルと機能 → Sample 1：数値のみを入力可能にする テキスト領域やテキストエリアを、数値のみを入力可能にします。 入力時に制御しているので、全角文字は入力できてしまいます。 サンプルスクリプト 緑の文字が変更箇所で、赤い文字が対応するスクリプトです。 "//"以下はコメントです。削除しても影響ありません。 必要な箇所をコピー＆貼り付けして編集してください。 → Sample 1：数値のみを入力可能にする <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- // 数値のみを入力可能にする function numOnly() { m = String.fromCharCode(event.keyCode); if("0123456789\b\r".indexOf(m, 0
これでサイトに独自の右クリックメニュー実装は誰でも簡単「jQuery Context Menu Plugin」:phpspot開発日誌
これでサイトに独自の右クリックメニュー実装は誰でも簡単「jQuery Context Menu Plugin」 2009年03月12日- jQuery Context Menu Plugin これでサイトに独自の右クリックメニュー実装は誰でも簡単「jQuery Context Menu Plugin」。 ちょっと前までだと独自の右クリックメニューを作るのはすごく大変でした。特にクロスブラウザで動作することなんかを考慮すると本当に大変でした。 が、このライブラリを使えば簡単に実装できてしまいます。 特定のエレメント上のみに右クリックメニューを設定できるという、柔軟なつくりになっています。 どのアイテム上でクリックしたかっていうのがイベントハンドラで受けられるところも汎用的になっていていいです。 このライブラリ１つとってみても、jQueryを使う意味が出てきそうです。 jQueryは本当にデフ
JavaScript のブロックスコープと名前空間 « Mozilla Developer Street (modest)]
Web 開発や拡張機能開発で JavaScript のコードを書いていると、誰もが一度は次のようなことで悩むかと思います。 ブロックスコープと名前空間 (グローバル変数汚染の回避) 読み書きしやすくデバッグしやすいコードスタイル コールバック関数と this オブジェクトの取り扱い デバッグ方法とデバッグ支援モジュール 非同期処理の書き方 いずれも解決方法は人によって様々で、これが常にベストと言えるものがなさそうですが、私なりにそれぞれ検討したことなどを書いてみようかと思います。もっと良い方法があるとか色々皆さんのご意見やツッコミをいただければ幸いです。 JavaScript では名前空間は言語仕様でサポートされておらず、ライブラリや拡張機能などのコードを書くときにはグローバル変数の使用を最小限に抑える必要があります。先日の Mozilla 勉強会＠東京 3rd でも佐藤さんと守山さんの発
![JavaScript のブロックスコープと名前空間 « Mozilla Developer Street (modest)]](https://cdn-ak-scissors.b.st-hatena.com/image/square/8eebd75773eb0321573d9040b42d88f184780c77/height=288;version=1;width=512/https%3A%2F%2Fdev.mozilla.jp%2Fwp-content%2Fthemes%2Fmodest%2Fimages%2Fpage-image.png)
Ajaxload - Ajax loading gif generator
Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
ASCII.jp：jQueryで作る多階層ドロップダウンメニュー｜Web制作の現場で使えるjQuery UIデザイン入門
多階層対応のドロップダウンメニューへ改造する サンプル01では1階層までのサブメニューを展開するメニューバーを作成しました。今度はより複雑な構造のサイトでも利用できるように、多階層対応のドロップダウンメニューへ改造します。 HTMLは次のようになります。サンプル01と同じようにul/li要素の入れ子で記述していきます。このサンプルでは、メニューA、Cは1階層目（子カテゴリー）までのサブメニューを、メニューBは2階層目（孫カテゴリー）までのサブメニューを記述しています。 ▼サンプル02（HTML部分） <ul class="menu"> <li><a href="#">メニューA</a> <ul class="sub"> <li><a href="#">サブメニューA</a></li> <li><a href="#">サブメニューA</a></li> <li><a href="#">サブメニ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Task List :: YUI 3 :: YUI Library
Yahoo! UI Library3（YUI3）データ処理に着目
7 line programming - ７行テトリスの解説
ASP.NET Web: The Official Microsoft ASP.NET 2.0 Site : Home Page
coolite.com - Registered at Namecheap.com
JsDoc Toolkitを使う！
