div要素をクロスフェード表示するJavaScript | WWW WATCH
結構前に公開されているので、すでに使っている人もいるかと思いますが、最近、個人的な用途で使わせていただいたので紹介。 Brand Spanking New で公開されている、「Javascript / CSS Crossfader」 は、JavaScript ひとつで簡単に、任意の div 要素 （じゃなくてもいいんですが） をクロスフェード表示で切り替えてくれるスクリプト。スクリプト自体が軽いのと、設定も簡単なので、ちょっとした画像の切り替えなんかに重宝しそう。 デモがこちらで公開されています。 必要なのは JavaScript ファイル 1つのみ。ダウンロードした JavaScript ファイルをサーバに上げたら、(X)HTML ファイルに読み込みます。 <script type="text/javascript" src="/js/bsn.Crossfader.js"></scrip
Established & Sons
A playful lighting installation at the Betts Project Gallery, London Design Festival 2023
FACEs: wmpとかiTunesみたいなエフェクト
1つ前の投稿、【習作】 Bitmap, BlurFilterを読んで windowsMediaPlayerとかiTunesみたいなエフェクトをflashで作ったのを思い出した。 flash8がでた頃(2005/10/26)に作ったので大分古いのだけど、 もったいないから晒しておこうかと。。。 どんどん画面が緑になっていき、元に戻らないのはご愛嬌。。。 大画面でみる これ、ビットマップデータをちょっといじるだけで結構簡単に作れる。 仕組みとしては、合わせ鏡の要領で、 _rootをキャプチャーして、ビットマップを適当にフィルタかけるなり、 カラーを変えるなり、拡大するなりしていじって _rootに描画する。 これを毎フレーム繰り返すだけ。簡単だー。 派手な画面書き換えをするわりにはスピードもまあまあでる。 as3では音の波形成分もとれるみたいだから、 本当に音楽にあわせて絵が
【レポート】あのmoo.fxがバージョン2に - 滑らかで超軽量のエフェクトはこれ! (1) moo.fx2-mootoolsとは (MYCOMジャーナル)
The Mad4Milk teamは3日(米国時間)、moo.fxの最新版となるmoo.fx version 2.0(以降、moo.fx2)を公開した。moo.fx2は超軽量のJavaScriptエフェクトライブラリ。mootoolsの一環として開発されているが、prototypeとともに動作するようにも作成されている。prototypeは"Ajaxian.com 2006 Survey Results"調査結果において43%の支持を得ている1番人気のAjaxフレームワーク。moo.fxは11%の支持を得て5位にランクインしている同じく人気のあるJavaScriptエフェクトライブラリ。 同チームは9月11日(米国時間)、JavaScriptライブラリ集であるmootoolsを公開。moo.fxとmootoolsはときに同じ意味として使われるが、moo.fxはより細かい成果物の名称として、
ページをマトリックス風に表示するJavascript | S i M P L E * S i M P L E
これは新しい。 なんとあらゆるページをマトリックス風に表示してくれるのだ。（実際の動作はこちら） 実装するには以下の1行をコードに加えるだけ。 <script src="http://bodytag.org/bt_melter/bt_melter.js" type="text/javascript"></script> するとbodyタグの中身全部に適用される。 なお、javascript自体はbodytag.orgからダウンロードできる。 日本語にも対応しているようなので、サイトにアクセントを加えるちょっとした小細工として使えそうですね。
JavaScriptポップアップを少し遅らせて閉じる効果を作成するサンプル:phpspot開発日誌
Timeout your Mouseovers This is a fun effect I built for Chowhound that does one better for mouseovers. The problem with most menu systems is that they're really touchy whether you're too fast or slow with the mouse. マウスオーバーするとポップアップするようなエフェクトはよく見かけますが、マウスアウトしたときにすぐ消えるのではなく、しばらくしてから消したいような場合に使えるサンプル。 prototype.js, scriptaculous(effect.js) を使って実装しているようです。 通常はマウスアウトするとすぐに消えますが、余裕を持たせて閉じるというのも触った感触とし
Javascriptライブラリmoo.fxを使ったクールなインタフェース集:phpspot開発日誌
NYOKIGLITTER - Tab Styled Accordion accordion flavors Javascriptライブラリmoo.fxを使ったクールなインタフェース集。 グリグリ面白い動きをするので、サイトの部品として利用することでクールなサイトが作れそう。 その１ その２ その３ CSSデザインなのでデザインを変えて利用することも簡単です。
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
吹き出し方式のツールチップテキスト作成JavaScriptライブラリ:phpspot開発日誌
wg:Bubble Tooltips Bubble Tooltips are an easy way to add (via a bit of CSS and javascript) fancy tooltips with a balloon shape to any web page. 吹き出し方式のツールチップテキスト作成JavaScriptライブラリ。 次のような吹き出し方式のツールチップテキストを作成できます。 次のようなJavascriptコードを書いておき、 <script type="text/javascript" src="BubbleTooltips.js"></script> <script type="text/javascript"> window.onload=function(){enableTooltips()}; </script> アンカー<a>タグのt
Untitled Document
The following applets (click on the images below to launch them) are simplified versions of the software that runs the Khronos Projector interactive installation (each applet has a pre-loaded time-lapse sequence). To be able to run the program online, you should have Java installed in your browser. The applet accepts input from mouse (and touch-screen). This Java applet is not as fast as the C++ v
水面に反射するような効果を画像に加えるJavaScript「Reflection.js」
上記画像を見れば分かるように、水面やなめらかな金属などに映り込んだような効果を画像に簡単に持たせることができるようになります。わざわざ画像を加工するソフトウェアを起動する必要がなくなるというわけ。映り込みの度合いも調整可能です。 Internet Explorer 5.5以上、Firefox 1.5以上、Opera 9以上、Safariで動作する模様。 Reflection.js http://cow.neondragon.net/stuff/reflection/ 「class="reflect"」というのを加えるだけで基本的に利用可能になります。画像ごとに効果を加える必要がなくなるというのがメリットらしい。ブログのアバター画像などで使うことを主目的に開発されたらしいですが、そのほかにも何か面白いことができそうな気もする。 なお、上記サイトからWordpressやphpBB、vBulle
casualplay.net blog
大変ご無沙汰していました。 個人的なご報告になりますが、先日、2年間在籍したbAを退職しまして、これからしばらくフリーランスとして活動していきます。関係者の皆様、今まで本当にお世話になりました。 出会えたすべての人に感謝しております。 どうも業界内で所謂Flasherと呼ばれる人種は基本的に変態気質というか、まるで社会と迎合しないような印象を持たれていたりしまして、やはり自分も例外なく変わり者扱いをされてやりきれない思いをしましたが、今となってはいい思い出です。 すでにやることが山積していますが、個人的にはこれからwebやUIデザインに関連したモノ作りをプラットフォームに拘らず幅広くやっていければと思っています。このブログもタイトル変えて再構築したいです。もっとカジュアルな方向で情報発信できれば。 今後の連絡先は以下になります。 koba{at}casualplay.net 何かありました
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
シンプルなエフェクト提供JavaScriptライブラリ「bytefx」:phpspot開発日誌