JavaScriptコーディングに関するテクニックやパフォーマンス等のリファレンス集:phpspot開発日誌
最近発見した、JavaScriptコーディングに関するテクニックやパフォーマンス等の参考になりそうなエントリをリファレンスをまとめてみました。 Avoiding Problems With JavaScript’s getElementById Method in Internet Explorer 7 | Impressive Webs IE7のgetElementByIdで起こる問題を避けるためのTIPS集。 How to add a CSS Link programmatically using JavaScript <link>タグをJavaScriptによって動的に作成してCSSを動的に設定するコード例 JavaScript CSS Selector Benchmarks CSSセレクタでDOMにアクセスする際の各フレームワークでの速度ベンチマーク比較 6 Ways To Wor
Javascriptのメニュースクリプト30 – creamu
Quenessというサイトで、Javascriptのメニュースクリプトがまとまっています。 ざっといくつかご紹介。 ・アコーディオンメニュー » Dynamic drive Accordion menu » i-MarcojQuery Accordion Menu ・Dockメニュー » MacStyleDock » Mootool Fisheye ・ドロップダウンメニュー » Superfish Menu » jQuery Context Menu ・スライドメニュー » Slide Menu » iPod Drilldown Menu ・ツリーメニュー » Tree Panel » Sitemap Styler その他のリストは以下からどうぞ。 » 30 Javascript Menu Plugins and Scripts 昨日は焼肉。うまかった〜。
アニメーションするドロップダウンメニュー作成ＪＳ「Sliding JavaScript Dropdown Menu」:phpspot開発日誌
アニメーションするドロップダウンメニュー作成ＪＳ「Sliding JavaScript Dropdown Menu」 2008年04月30日- Sliding JavaScript Dropdown Menu - Web Development Blog This lightweight drop down menu script (~1.8kb) allows you to easily add smooth transitioning dropdowns to your website. This can be used for navigation, dropdown lists, info panels, etc.アニメーションするドロップダウンメニュー作成ＪＳ「Sliding JavaScript Dropdown Menu」 デモページはこちら メニューの中身は単なるul li
JavaScriptライブラリのPrototypeで作られたRPGゲーム『ProtoRPG』 | 100SHIKI
JavaScriptでここまでできる！を体現したようなサイトのご紹介。ProtoRPGはJavaScriptライブラリのPrototypeを駆使して作られたRPGゲームである。 矢印キーで移動し、U（Use）やT（Talk）を使いながらゲームを進めていくことができる。ゲーム感は一昔前の家庭用ゲーム機とまったく変わらない。ブラウザでここまでできるかぁ、と実に感慨深い。 なお、同サイトにはブログやWikiも併設されており、このゲームがどのように作られたかも公開されているようだ。技術的な話に興味がある人は覗いてみるといいだろう（まだ記事数は多くないが・・・）。 ブラウザで何ができて何ができないのか。そうした知識は常にアップデートしていきたいですね。
JavaScriptとAJAXでページ上のマウスの動きを録画・再生するデモ
ページ上で動かしたマウスの軌跡を記録し、再生することが可能になるJavaScriptやAJAXなどの組み合わせデモが公開されています。実際に試してみればわかりますが、記録している際には、特に記録されていると気づくような要素は全くありません。 応用としては、広告バナーのクリックについてアイトラッキング（目の動きを追う）の代わりに、マウスの移動する軌跡を記録して「マウストラッキング」が可能になったり、あるいはAJAXをフルに駆使したサイトにおけるユーザービリティの記録による操作の改善、あるいは各種スパイ行動などにも使えます。 実際のデモは以下から。 Record mouse movement using Javascript and AJAX http://pure.rednoize.com/movelogger/ 上記ページで四角いキューブの辺の周囲をマウスでなんどかぐるぐると回転させてみた
Record mouse movement using Javascript and AJAX マウスの動きを再現
Move your mouse around in this page. Move it to some places you can remembers. For example move your mouse cursor along the edges of the cube. Click on the bulb to start an amazing highlight effect. I use Prototye Event.observe() on the image to start the effect on this paragraph. Event.observe($('img-bulb'), 'click', function(){ new Effect.Highlight('highlight', {duration:2.0}); }); No big deal
クールにスライドするメニューを作成するJavaScriptライブラリ「Image Menu」:phpspot開発日誌
Image Menu クールにスライドするメニューを作成するJavaScriptライブラリ「Image Menu」。 メニューにカーソルを合わせると、カーソル部分がアニメーションしながら開くメニューを実装できます。。 画像を変えれば、よりクールなメニューを作れそうですね。 必要なJSライブラリ,CSSをインクルードした後、次のようなコードで簡単に初期化できる模様。 <h2>Example:</h2> <div id="kwick"> <ul class="kwicks"> <li class="kwick opt1"><span>Lanscapes</span></li> <li class="kwick opt2"><span>People</span></li> <li class="kwick opt3"><span>Nature</span></li> <li class="kwi
The work of Scott Schiller
Scott Schiller: Creative, Technical and Professional Portfolio This site showcases the work of Scott Schiller. I am a Web Developer currently located in Calgary, AB. A bit of philosophy My passion for the Web is demonstrated by the work I do; rather than try to explain it all, I prefer to let my work speak for itself. This site exists for that reason - to showcase some of the things I have done in
HTMLテーブルに分かりやすいカーソルハイライト機能を付けられるJSライブラリ「Tablecloth」:phpspot開発日誌
HTMLテーブルに分かりやすいカーソルハイライト機能を付けられるJSライブラリ「Tablecloth」 2007年10月10日- Welcome to Tablecloth Tablecloth is lightweight, easy to use, unobtrusive way to add style and behaviour to your html table elements. HTMLテーブルに分かりやすいカーソルハイライト機能を付けられるJSライブラリ「Tablecloth」。 テーブルにカーソルを合わせると次のように、現在位置がハイライトされます。クリックすると、その位置のハイライトを固定します。 シンプルな効果ですが、データが多くある際、現在位置の確認や、チェックしておきたい部分をハイライトさせておくことが出来るなど、ユーザビリティ向上が期待できますね。 使い方は次
[JS]簡単に設置できるページ内をスムーズにスクロールできるスクリプト -Page Scroller ver.3 | コリス
以前、紹介した「Page Scroller」のバージョンアップ版「Page Scroller ver.3」の紹介です。 追記： 2013年10月26日 ver.3.0.9をリリース jQueryの旧版によるXSSに対応しました。 2011年5月4日 デモおよびダウンロードファイルをjQuery1.6に変更しました。 2011年1月31日 ver.3.0.8をリリース 機能を追加しました。 2010年11月19日 ver.3.0.7をリリース ライセンスを変更しました。 2010年11月17日 デモおよびダウンロードファイルをjQuery1.4.4に変更しました。 2010年9月19日 デモおよびダウンロードファイルをjQuery1.4.2に変更しました。 2009年7月6日 対応ブラウザ（IE8, Fx2.5, Chrome2）を更新しました。 2009年2月23日 ver.3.0.6をリ
![[JS]簡単に設置できるページ内をスムーズにスクロールできるスクリプト -Page Scroller ver.3 | コリス](https://cdn-ak-scissors.b.st-hatena.com/image/square/bc54860ba06deaa45382cf2bddc929515def0354/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fshared%2Flogo-2014050501-en.png)
超軽量JavaScriptフレームワーク「SimpleJS」:phpspot開発日誌
SimpleJS SimpleJS is a javascript library simple and light proposing functions ready with the use to facilitate the exploitation of ajax. 超軽量JavaScriptフレームワーク「SimpleJS」。サイズはなんと14KB. 機能は次のような感じ。
jQuery
What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.
GIGAZINE - いろいろな効果を追加できるJavaScriptライブラリ「jQuery」
ファイルサイズわずか10キロバイト、CSSの1から3、XPathをサポートし、Internet Explorer、Firefox、Safari、Operaで動作します。「JavaScriptのコードを書くのが楽しくなる」というのがモットーらしい。 ダウンロードや実際の例、使い方などの各種取り扱い説明は以下の通り。 jQuery: New Wave Javascript http://jquery.com/ 上記ページの「Run」をクリックするとその機能の一端を垣間見ることができます。面白い効果です。 その他のデモとしてはこんな感じでいろいろなところに使えます。特に一番下の「Example G」のボタンをクリックしてから本文の上にマウスを乗せると色が変わり、フェードしながら元に戻るというのはシンプルながら面白い。 JQuery http://codylindley.com/blogstuff
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Michael Leigeber
Michael Leigeber
GridViewで固定のヘッダーを作成する方法
Phatfusion:image menu
株式会社ロックオン社員ブログ | 大阪市北区に本社を置く、ベンチャー企業株式会社ロックオン！「アドエビス」「EC-CUBE」「THREe」など、多くのNo.1製品を輩出する会社の裏側をお見せします。
CSS Juice » 16 Sortable Table Techniques
SimpleJS