自己紹介 外村 和仁 @hokaccha 株式会社 ピクセルグリッド JavaScript, Node.js, Ruby
自己紹介 外村 和仁 @hokaccha 株式会社 ピクセルグリッド JavaScript, Node.js, Ruby
マウスカーソルに着いて来るように画像を表示します。 仕組みはJavaScriptでマウスカーソルが移動する度にイベントからその位置を 受け取り、画像の位置を移動させます。 スクリプトは次のようになります。ページが読み込まれた後に実行されますが、 特に問題無ければhead内に置くと良いでしょう。このスクリプトの画像URLの部分に マウスストーカーとして使用する画像を指定するだけで動作します。 <script type="text/javascript"><!-- // Mouse stalker. // (C)2007 Amenti. http://amenti.usamimi.info/ // 2007/07/28 release. // Terms of use: Keep to copyright. No claim. No support. if (window.addEventLi
ページ内をスムーズにスクロールできるスクリプト:Page Scrollerの最新版「3.0.1」をリリースしました。 スクリプトの詳細やダウンロードは、下記よりどうぞ。 簡単に設置できるページ内をスムーズにスクロールできるスクリプト -Page Scroller ver.3 主な変更点は、下記の通りです。 3.0.1 スクロール中のマウスのクリックに対して、スクロール動作が止まるようにしました。 スクロール中の別のアンカーへのクリックに対して、スクロール動作が止まるようにしました。 jQuery 1.2.1に対応しました。 ファイル名を「page-scroller.js」から「jquery.page-scroller.js」に変更しました。 実際に使用する際は、どちらのファイル名を使用しても問題ありません。
JavaScript チュートリアル 初級編 JavaScript の基礎 JavaScript の第一歩 JavaScript の構成要素 JavaScript オブジェクト入門 JavaScript ガイド 入門編 文法とデータ型 制御フローとエラー処理 ループとイテレーター 関数 式と演算子 数と日付 テキスト処理 正規表現 インデックス付きコレクション キー付きコレクション オブジェクトを利用する Using classes プロミスの使用 JavaScript 型付き配列 イテレーターとジェネレーター メタプログラミング JavaScript モジュール 中級編 クライアントサイド JavaScript フレームワーク クライアントサイド Web API Language overview JavaScript のデータ構造 等値比較と同一性 プロパティの列挙可能性と所有権 クロ
Script.aculo.usは、Thomas Fuchs氏を中心とするチームにより開発されているJavaScriptライブラリだ。MITライセンスが採用されており、2005年から公開を始め、執筆時点では11月に公開されたバージョン1.8が最新版になる。本稿では、そのバージョン1.8を使って(連載継続中にバージョンアップした場合はそちらに変更する可能性がある)、同ライブラリの基本を6回にわたって紹介しよう。 なお、Script.aculo.usを扱ううえでの必須知識となるPrototype.jsの使用法については、連載『いまからはじめるPrototype.js』で解説しているので、そちらをご覧いただきたい。 Script.aculo.usの概要 Script.aculo.usはPrototype.jsをベースに動作するライブラリだが、Prototype.jsが1つのファイルにすべての機能を
Dean Edwards氏は7日(米国時間)、IEの動作をW3C標準仕様へ準拠させるためのライブラリIE7.jsの最新版を公開した。IE7.jsはJavaScriptで開発されたMS Internet ExplorerのHTML/CSS表示を調整するライブラリ。IE7.jsを使うことでMSIEのHTML/CSSまわりの表示処理をよりW3C標準規約に準拠したものにする。IE5やIE6で透過PNGを表示できるようにもなる。 IE7.jsは基本的にMSIE5/6向けに用意されていたライブラリをIE7に対応させたもの。これまでのモジュール構造は廃止され、IE7.jsやIE8.jsといったように個別のファイルに分離されている。ホスティング先もGoogle Codeへ変更された。IE7.jsはサイズも縮小され、圧縮した状態で11KBほど。またbase2.DOMのセレクタエンジンを使うことでより高速に動
Working with hugedomains.com was a quick and easy process. We got to speak to multiple real people located in Colorado without having to wait on hold! Our only complaint was we felt we had to overpay more than this particular domain was worth, and we weren't able to negotiate it down to a level that we felt was fair. However, payment and delivery were seamless, and within a few hours we had all of
prototype.js ベースの日付選択用 javascript ライブラリ「protocalendar.js」を公開しました。 rails や cakephp でアプリケーションを作っていて、セレクトタグでは日付を選択し辛いと感じていました。 また、オープンソースの Date Picker ライブラリでは機能不足、もしくはオーバースペック過ぎて手頃なものがないと感じていました。 そこで、社内で prototype.js ベースの日付選択用ライブラリを作ってみようということになり作ってみました。 今後もバージョンアップしていきたいと考えているので、ご意見ご要望などありましたらコメントでお願いします。 【特徴】 *prototype.js ベース(1.5 以降)。 *シンプルで軽量。 *MIT LICNESE *16のローカライゼーションに対応。 *フォーカスでカレンダー表示。(
InnerFade with jquery InnerFade is a small plugin for the jQuery-JavaScript-Library. 要素の中身をアニメーションしながら切り替えられる「InnerFade with jquery」。 スライドショーのように、要素内がアニメーションしながら切り替わるパーツが作れます。 便利なのは、画像が切り替わった際に、画像からのリンク先も切り替わる点。 実際には、次のように、ul 要素内の li を順にアニメーションするという仕様になっているようで、その実装も簡単です。 <ul id="portfolio"> <li> <a href="http://medienfreunde.com/deutsch/referenzen/kreation/good_guy__bad_guy.html"> <img src="images
本日は、現在製作中のツールの副産物としてできた、 HTML 要素をドラッグ・リサイズするライブラリをご紹介します。 DHTML でポップアップウインドウなどを実現するのに便利です。そんなライブラリいくらでもあるよ!と言われそうですが、けっこう頑張って座標補正などしていて、以下の特徴があります。 要素がドキュメントからはみ出さないように補正する。 ドラッグ中にスクロールしてもドラッグ位置がずれない。 要素が表示領域外に出たときは自動スクロール。 DragResize クラスを除き、グローバルな名前空間を汚染しない。 他のライブラリに依存せず、単独で動作する。 若干の制限はあるものの、概ねクロスブラウザで動作する。 なるべくデスクトップに近い操作性を得られるように工夫したつもりです。とくに利用制限などはありませんので、改変や商用アプリへの組み込みなど、ご自由にお使いください。ただし、動作保証な
Calendar: a Javascript class for Mootools that adds accessible and unobtrusive date pickers to your form elements カレンダーには3つのデザインが用意されており、スタイルシートでデザインの変更も可能です。 calendar.jsはmootoolsのプラグインのため、動作にはmootools.jsが必要です。
footerをウィンドウ下部に固定する『footerFixed.js』 footer部分を画面下部に固定するためのjsライブラリ『footerFixed.js』を作成しました。 フッターをコンテンツの内容量にかかわらずwindow下部に表示させるためのjsライブラリです。 サンプル 設置方法は head要素なのでfooterFixed.jsを読み込みます。 <script type="text/javascript" src="./footerFixed.js"></script> ウィンドウ下部に固定したい要素にid属性「footer」を付けます。 これでその要素をウインドウの下部に表示させることが可能です。 (ウインドウの下部というのがわかりにくいと思うのですが、内容量がウィンドウサイズを超える場合は通常通り、内容量がウィンドウサイズより小さい場合はウィンドウの下部に配置という意味です
MooTools Mocha UI Mocha is a MooTools user interface class made with canvas tag graphics. This is an on going exercise to help me become more familiar with both MooTools and the canvas tag. 軽快かつクールなページ内小窓作成用ライブラリ「Mocha UI」。 次のような移動&リサイズ&クローズ&最大化可能なウィンドウを簡単に作成できます。 サイト内のデモでは、タイトルと内容を入力することで、動的にウィンドウを作成できることが紹介されています。 フレームワークには、mootools 使用。 かなり軽快に動いてくれ、ページ内で別窓を作るUIを作る際にはかなり使えそう。 関連エントリ Prototype.jsベ
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 前回のjQueryのプラグイン33+1選 -2007年9月と合わせて、参考ください。 lightbox for jQuery jQu
Dojo Toolkit 先日、フルスタックのJavaScriptフレームワークであるDojo Toolkitのバージョン1.0がついにリリースされた。Academic Free License v2.1とBSD Licenseのデュアルライセンスが採用され、使用するプロジェクトに合わせてどちらかを選べるようになっている。 足かけ三年以上にわたり開発が行われた同フレームワークは、期待に違わず凄まじく多機能で、その全体像をつかむのも容易ではない。 今回は、Dojo Toolkitに関して広範かつ、なるべく詳細な解説を行うため、二回に分けた特集を試みる。 特集の前半である本記事は、Dojoの基本的な知識とトピックを解説したいと思う。後半では、Dojoが備えるUIウィジェットの話題を中心に、Dojoを使用してリッチなWebページを作成するための様々なテクニックを紹介したい。 ということで、前半記
昨日のSIGHCIのメモです。 最速インターフェースの研究と実践: ライブドア mala氏 まず、自己紹介を兼ねて概論 ブログ「最速インターフェース研究会」 WebのUIの進歩の停滞に対する批判を込めて名付けた 自分の肩書きは「インターフェースエンジニア」 よいUIを作るために「実体験に基づいたチューニングをしている」 自分で使ってみる ユーザの反応を見る 欲望に忠実に作る 作業としては、perl, html, jsの記述 「実のところ、プログラミングに詳しいと言える自信はないし、デザインのことも深くはわからないが、一人で一通りこなせる(完成品を作れる)という点は自分の強み。 よいUIを作るための作業は横断的。割り当てられた仕事をするだけの人ではダメ。」 作品紹介 2ch最速検索 キーボード操作だけでスレッド検索 まだAjaxは使っていない 「めくり型」UIの実験 スクロールしながら読むよ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く