バナーのローテーション表示を JavaScript で! - codess - builder by ZDNet Japan バナーのローテーション表示を JavaScript で行うサンプルが公開されてます。 同じセッション内で広告を切り替えられるので、なかなかよいですね。 やってそうであまりやってないというこの機能、今後普及しそうな気がしないでもないです。
バナーのローテーション表示を JavaScript で! - codess - builder by ZDNet Japan バナーのローテーション表示を JavaScript で行うサンプルが公開されてます。 同じセッション内で広告を切り替えられるので、なかなかよいですね。 やってそうであまりやってないというこの機能、今後普及しそうな気がしないでもないです。
アフィリエイトなどで利用するバナー広告は、通常、1つの広告枠(広告表示領域)に1つの広告しか表示できません。 (Flashバナーでは、この枠にとらわれないものもありますが) 「複数の商品のバナー広告を掲載したいんだけど、広告枠はこれ以上広げたくない!」 こんなときに役立つテクニックが、バナーのローテーション表示です。 簡単に説明すると、1つの広告枠に次々と色々な広告を表示していく方法です。 この方法はページスクロールが発生しない(させない構成の)ページにとても有効です。 狭い領域を有効に活用しましょう! 簡単なサンプルを作成しましたので、参考にどうぞ。 実装は JavaScript (prototype.js利用) で行っています。 詳細についてはサンプルページのソースコードをご覧ください。 サンプルページ ※このエントリは builder メンバーにより投稿されたものです。シーネットネッ
JavaScript Color Fading Script - Web Development Blog This lightweight JavaScript allows for easy color transitions.JavaScriptでクールにカラーフェードアニメーションを実現。 divの要素なんかを、灰色から緑にアニメーションしながら変化させるライブラリが公開されてます。 colorFade('divid','background','ece7b4','f9bcbc',25,30) のように呼び出せばOKみたい。 背景色(background-color )だけでなく、フォント色(color)や、線の色(border-color)を変化させることも出来るみたい サンプルが多数のデモページはこちら 単に色を変えるよりもインパクトがあって、分かりやすいUIを実装するのに役立
jContext 1.0 - The ultra-lightweight right click context menu for jQuery | Keansphere 右クリックメニュー等コンテキストメニューをカンタン作成JS「jContext」。 次のような独自右クリックメニューをカンタンに実装できるようです。 初期化は以下のようにJSでシンプルに。 $(obj).showMenu({ opacity:0.8, query: "#myMenu2", zindex: 2000 }); マークアップも次のように直にHTMLが記述できて便利。 <div id="myMenu2"> <ul> <li><a href="#">Create New Class</a></li> <li><a href="#">Delete Class</a></li> <li><a href="#">Get a
Timeframe ドラッグ&ドロップで範囲指定できる日付選択UI実装ライブラリ「Timeframe」 次のようなUIで、日付をD&D選択できるJSウィジェットが公開されました。 次のような感じに初期化するようです。 <script type="text/javascript" charset="utf-8"> //<![CDATA[ new Timeframe('calendars', { startfield: 'start', endfield: 'end', previousbutton: 'previous', todaybutton: 'today', nextbutton: 'next', resetbutton: 'reset' }); //]]> </script> 範囲指定の入力に便利そうですね。 関連エントリ 日付の範囲を指定できるJavaScriptデートピッカー「
busy.js (loading indicators) busy.js 1.0 allows you to add/remove loading indicators to html elements on your webpages 指定したHTMLエレメントをローディング中にする際に便利な「busy.js」。 例えば、div 要素全体に次のようにローディング中にすることが出来ます。 デモはこちら - 要素をクリックでローディング状態にすることが可能 オーバーレイで要素自体の色も変わるため、ローディング中であることがよく分かるようになっています。 関連エントリ グレーアウト表示ライブラリ:glayer.js 様々なLightBox風ダイアログを超簡単に作れるJavaScriptライブラリ「Control.Modal」
prettyPhoto - jQuery lightbox clone - by Stephane Caron Here's my jQuery lightbox clone, I did it because those available are either not close enough to the real lightbox (lacking animations, not supporting galleries, etc ,etc) or were just not suiting my need.jQueryベースのLightBoxクローン「prettyPhoto」。 特に真新しいというわけではありませんが、jQueryベースで動作します。 LightBox同様、複数画像でページ送りができるモードと、単体に対して設定することもできます。 最初から角丸になっているので角丸
Easy Scroll v1.0 - Unobtrusive content scroller This is a demonstration of an unobtrusive content scroller.コンテンツをブロック内でスクロールさせられる「Easy Scroll」 先日、横スクロールのものを紹介しましたが、たてスクロールのものもありましたね。 狭い範囲に情報を入れたい場合に活用できそうなので覚えておきましょう。 関連エントリ カーソル位置によって自動スクロールする小窓実装ライブラリ
SEOに便利なFirefoxエクステンション色々 SEO用のエクステンションもいろいろあるようですね。 SeoQuake :: Firefox Add-ons SEOに便利なFirefoxエクステンション「SeoQuake」。 インストールすると、Googleのページランク、リンク数、関連リンク、Yahooのリンク数、関連リンク数などの情報が得られます。 SEO for Firefox Googleの検索結果にページランクなどのSEO情報を表示。 その他便利な機能いろいろ RankQuest SEO Toolbar 30以上のSEOツールに簡単アクセス Live PageRank ページランクをステータスバーに表示 Alexa Sparky Alexa情報をステータスバーに表示 SEOHAND ページランク、バックリンクなどを元にグラフを作成 実に様々な拡張がありますね。IEもこんな感じに
Pure CSS Animated Progress Bar | Css Globe Here's a simple demonstration of how you can create animated progress bar using pure css. JSレスでピュアCSSの超カッコいいプログレスバーのサンプル →デモを見る - ズイズイアニメーションしていきます。 何とこれ、JavaScriptを使っていません。 CSSとHTMLオンリーです。 仕組みは、GIFアニメーションで100%までプログレスする画像を作成しておき、進捗部分までを画像で塗りつぶすというもののようです。 CSSだけじゃ無理だと思うようなところもCSSのみでやっちゃうのは感動してしまいますね。 関連エントリ JavaScriptでの進捗表示に便利な「jsProgressBarHandler」がアップデート
Flexigrid 手軽に使えるExcel風グリッドUI「Flexigrid for jQuery」。 カラムのソート、ページング、項目のフィルタリングが可能なグリッドUI。 jQueryベースで、18KBで使えます。 単純なグリッドUI ソート機能やページング機能を搭載したグリッド jQueryをメインで使っていて、手軽にこうしたエクセル風UIを実装したい場合に使えそうです。 関連エントリ リッチなExcel風グリッドインタフェースを提供するJavascriptライブラリ「dhtmlxGrid」 Yahoo! UI Library を使ったページ送りが可能なグリッドコンポーネント AjaxベースのPHPを使ったグリッドコンポーネント Ajax+PHP+Smarty+script.aculo.usなデータグリッドコンポーネント 高機能なJavascriptツリーグリッドコンポーネント
iBox - Lightweight inline popup iBox is a lightweight script that lets you overlay images and documents in a small dialog without a page reload.多機能LightBoxのiBoxがバージョンアップ「iBox v2」。 以前に紹介したiBoxがバージョン2にアップしていました。 画像、HTMLドキュメントに加えてYoutubeビデオ、インラインコンテナ(hiddenで内部に記述したdiv)を開くことができるようになっているみたい。 iBoxは依存ライブラリがなく、ライブラリ自体は7KBなので、この機能だけ使いたいという場合に使えますね。
IzzyMenu - Menu Builder - Build your pro CSS/DHTML Menu! オンラインでクールなメニューを簡単作成「izzymenu」。 パラメータをカスタマイズするだけでクールなメニューが簡単に作れてしまうというサービス。 メニュー作成の容易化もさることながら、サイト自体がフルAjaxでサクサク動いて気持ちいいですね。 参考エントリ 秋元@サイボウズラボ・プログラマー・ブログ: オンラインCSS/Javascriptメニュージェネレータ izzymenu 120以上生成できるCSSメニュー作成ジェネレータ『IzzyMenu』レビュー*ホームページを作る人のネタ帳
PHPでATOM、RSS1/2フォーマットのフィードが超簡単に吐き出せる「FeedWriter.php」 2008年03月12日- PHP Universal Feed Generator (supports RSS 1.0, RSS 2.0 and ATOM) | ajaXray It’s been a while since I’ve planned on developing a feed generator that fulfills most my needs by supporting the various feed formats. PHPでATOM、RSS1/2フォーマットのフィードが超簡単に吐き出せる「FeedWriter.php」。 RSS1や2、ATOMのフォーマットを理解して出力するのは面倒ですね。 このライブラリを使えば、RSS1/2もATOMも、クラスを作成す
jWYSIWYG This plugin is an inline content editor to allow editing rich HTML content on the fly. シンプルなWYSIWYGエディタ作成用JSライブラリ「jWYSIWYG」。 必要なスクリプトを読んだ後、次のようにマークアップ。 <div class="box"> <textarea id="wysiwyg" rows="11" cols="69"></textarea> </div> 初期化は「 $(function(){ $('#wysiwyg').wysiwyg(); }); 」だけでOKみたい。 WYSIWYGエディタは他にも色々ありますね。 Yahoo UI Library ベースのWYSIWYG prototype.jsでクロスブラウザなWYSIWIGエディタ FCKEditor Tin
woork: Flickr like horizontal menu This tutorial explains how to implement an horizontal menu Flickr-like using CSS and Javascript to show/hide sub-menu: Flickrで使われているあのクールなドロップダウンメニューを実装してみよう! 次のようなクールなドロップダウンメニューを実装してみましょう。 紹介元で、HTMLと画像のサンプルが配布されています。 実装自体は次のように関数が定義されていて、 <script language="javascript"> function showMenu(id_menu){ var my_menu = document.getElementById(id_menu); if(my_menu.style.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く