滑らかな画像スライドショーを実現するJavaScriptライブラリ:phpspot開発日誌
JonDesign's (Javascript) SmoothGallery: Mootools Mojo for Images | What is it ? Using mootools v1.0, this javascript gallery and slideshow system allows you to have simple and smooth (cross-fading...) image galleries, slideshows, showcases and other cool stuff on your website... 滑らかな画像スライドショーを実現するJavaScriptライブラリ。 画像の透明度を下げながら画像を切り替えるので、滑らかな画像切り替え効果が得られます。 デモページ 実装は、JavaScriptとCSSを読み込んでHTMLを定義し、Jav
便利すぎて困る程のFireBug1.0系を使ってみよう:phpspot開発日誌
Firebug - Web Development Evolved 便利すぎて困る程のFireBug1.0系を使ってみよう、ということで、広く使われているであろう0.4系と変わった点をプレビュー。 Googleなどの検索エンジンで、addons.mozilla.org にUPされている0.4系が上に表示されているため、まだ1.0系を使っていない人も多いのではないでしょうか？(という私もそうでした) FireBug1.0系のインストール方法の紹介〜その追加された強力すぎる機能について見ていきましょう。 FireBug1.0系インストール http://www.getfirebug.com/ にてFireBug1.0系のインストール。 FireFox - DOMインスペクタのインストール FireFoxインストール時にDOMインスペクタが入っていない場合は、FireBug1.0系の機能を最大限
Flashなしでもここまで作れる！：ITpro
Webプログラミングは，プロはもちろんアマチュアのプログラマの間でも，もはや欠かせない開発ジャンルの一つです。しかし，書籍や雑誌の解説記事のほとんどが，データベースがどうとか，サーバーサイドがどうとか，どうしてもディープな方向に進んでしまう傾向にあります。もちろん，それはそれで大切なことなんですが，いったい何割の人が，その技術を“自分の”ホームページに使っているでしょう。 最近話題の「リッチ・コンテンツ」にしても同様です。例えばFlash。たしかにActionScriptというスクリプト言語を使えば，動く，鳴る，つながると，いいこと尽くめです。でも，いかんせん「Macromedia Flash MX 2004を買ってきてね」とあっては，皆がみな使えるわけではありません。 Part1でも解説があったようにblog（ブログ）の認知度が上がり，利用率も増えて，プロバイダからの提供体制も整ってきて
IE6とIE7を判別するJavascriptコード:phpspot開発日誌
Abe Fettig’s Weblog 実Detecting IE7 in Javascript IE6とIE7を判別するJavascriptコード。 判別は次のようなコードで出来るようです。 if (typeof document.body.style.maxHeight != "undefined") { // IE 7, mozilla, safari, opera 9 } else { // IE6, older browsers } IE7もそろそろ正式版がリリースされるようですのでメモしておくとよいかも。 関連エントリ 古いバージョンのＩＥを１台のＰＣで使う方法 IE7 Is Coming This Month...Are you Ready?
クールなJavaScriptライブラリ - mootools登場 | エンタープライズ | マイコミジャーナル
The Mad4Milk teamは11日(米国時間)、JavaScriptライブラリ集「mootools」を公開した。mootoolsはコンパクトにまとめられたJavaScriptライブラリで、モジュール形式、オブジェクト指向で開発されている。 mootoolsはThe MIT Licenseのもとで提供されているオープンソースソフトウェア。Safariで動作確認がとられているほか、IE 6/7、Firefox、Opera、Caminoでの動作が確認されている。特にFirefoxで動作する場合にすぐれた実行速度が実現されるという。 mootoolsは次の15のJavaScriptライブラリから構成されている。ネイティブスクリプトはメインライブラリに依存し、アドオンはメインライブラリとネイティブスクリプトに依存している。 メインライブラリ Moo.js (必須) ネイティブスクリプト Fu
GIGAZINE - マウスホイールの回転イベントをJavaScriptで検知する
実際の例としては「Google マップ」がまさにそうです。マウスのホイール部分を回転させると、地図を拡大縮小できます。 これと同じ仕組みを実装するにはどうすればいいの？というお話。 Mouse wheel programming in JavaScript http://adomas.org/javascript-mouse-wheel/ テストページはこちら、マウスホイールを回転させると表示が変わる http://adomas.org/javascript-mouse-wheel/test.html ほかにもこんなことができます。 JavaScript++かも日記: マウスホイールで拡大縮小 インフォシーク ホームページ作成「マウスホイールで画像を拡大縮小する方法」 せつないぶろぐ : JavaScriptによるマウスホイールのイベント処理 暴満館 >> OperaのJavaScript
GIGAZINE - ファイルサイズわずか3KBのオーバーレイ効果「Litebox」登場
オーバーレイ効果を作り出す「Lightbox」というスクリプトの超軽量版です。 実際の例やダウンロードは以下から。 Litebox- Same great taste, less calories http://www.doknowevil.net/litebox/ 上記ページの画像をクリックするとどういう効果なのかがよく分かります。 Liteboxで使われているのがこの「moo.fx」という軽量なJavaScriptエフェクトライブラリ。 moo.fx - the next small thing http://moofx.mad4milk.net/ また、類似品としてはこんなのもあります。 GIGAZINE - オーバーレイ効果を作り出す軽量スクリプト「iBox」
水面に反射するような効果を画像に加える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
Flickr開発者が語るネットサービスの高速化方法
Web2.0としてくくられるタイプの各種ネットサービス、いわゆるウェブアプリは以前とは比較にならないほど動的生成されるものが多く、結果としてものすごい負荷をシステムにかけるわけです。 というわけで、海外におけるデジカメ画像共有サービスの代表的なものである「Flickr」の開発者がJavaScriptを高速化する手法について解説しています。 Vitamin Features >> Serving JavaScript Fast 手順を分割して簡単にしてみたり、キャッシュを使ったり、転送量を圧縮して帯域を節約したりいろいろあるようです。なお、GIGAZINEはキャッシュシステムを採用して有効活用することで負荷を現在、当初の12分の1に抑えています。 また、こっちはリバースプロキシによる高速化手法。 ViSolve.com - Squid Support Service Apacheのモジュール
画像やページをLightBox風に表示できるThickbox:phpspot開発日誌
Thickbox - One box to rule them all. Thickboxを使えば簡単に画像やHTMLファイルの中身をLightBox風にカッコよくページ内表示できます。 画像の場合 必要なCSSファイルとJavaScriptファイルをインクルードした上で、次のように画像タグを<a>タグで囲います。 <a>タグには class="thickbox" を指定し、title属性に画像の説明文を入れます。 <a href="images/image2.jpg" title="画像と一緒に表示させたい文字列" class="thickbox"><img src="images/image2_t.jpg" alt="Image 2"/></a> たったこれだけで、次のようにLightBox風に画像を開くことが出来ます。 titleで指定した説明文が画像の下に入ってます。 次にHTML
llameradaの日記 - ユーザがページに滞在した時間をサーバに記録するJavaScript
Ajaxの普及に伴い、ページ当たりのユーザの滞在時間が注目されるようになっている。従来、サービスがユーザに与えるインプレッションの指標としてページ・ビューが広く用いられている。しかし、Ajaxを利用するとページの移動があまり発生しないため、ページ・ビューが低くなってしまう。そこで、インプレッションの指標として、滞在時間を使おうという動きがある。 今回、JavaScriptでユーザの滞在期間が記録できるかどうか調べてみた。取り組む前は難しいかなと思ったが、実際にはとても簡単であった。コードは下記。 (function(){ var start = new Date; window.onunload = function(){ var time = (new Date - start ); var image = new Image; image.src = "/dummy?t=" + tim
秋元@サイボウズラボ・プログラマー・ブログ: Yahoo! UI Library はすごいね
via O’Reilley Radar Yahoo! UI Library で、Yahoo! が実際に使っている Javascript のライブラリ集が公開されている。 Yahoo! のどこでこんなユーザインタフェースが使われてるんだろう? と思うぐらい、サンプルで見せられる UI パーツは豊富だ。それぞれの “Example” を見てまわるだけでもおなかいっぱいだ。 コアユーティリティ アニメーション クロスブラウザ対応の XMLHttpRequest ラッパ DOM 操作 ドラッグアンドドロップ イベントハンドリング UI コントロール部品 カレンダー スライダー ツリー ドラッグアンドドロップなんかは、ファンタジースポーツで使われているのを見たことがあるので知っていた。複数のリスト間でアイテムの移動や並べ替えを行うときには使えるパーツだろう。 日本語カレンダーなんかも、いい感じで再利
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
