noobSlide 気持ちよいスライド機能を提供する「noobSlide」。 自動で画像をスライドさせたり、ページ送りでスライドさせたりできるスライド機能を提供。 プレビュー付きのスライドショー機能も実装できます。 画像だけでなく、スライドショー機能も実装できます。 関連エントリ jQueryベースのLightBoxクローン「prettyPhoto」 カスタマイズできる多機能LightBox「Lightview」
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デートピッカー「
Web Development Blog Custom JavaScript Dialog Boxes have put together a lightweight (~4.5kb) JavaScript dialog box library. JSによるカスタムダイアログボックス作成ライブラリ。 JavaScript標準のダイアログボックスでなく、以下のような、エラー、警告、成功、確認の4つのダイアログを実装できるライブラリが公開。 ポップアップすると背景がグレーでなく白っぽくなってダイアログが現れます。 通常のダイアログはBeep音が流れて驚きますが、ソフトにダイアログを出したい際につかえます。 ダイアログに大きくアイコンが表示されていて、色合いもあって分かりやすいかも。 関連エントリ ページ内でpromptやconfirmの実行を可能にするJavaScriptライブラリ「pprom
Javascript Graphical / Virtual Keyboard Interface This script is a reusable system for adding a graphical keyboard interface to text fields, password fields and textareas so they can be filled with mouse only. バーチャルキーボード実装用JSライブラリ。 このライブラリを使えば、inputやpasswordフィールドにバーチャルキーボードの機能を実装できます。 日本語が入力できないのが残念なのですが、マウスだけでアルファベットを入力できるということで、使いどころによってはユーザビリティを向上できそうですね。
アニメーションするドロップダウンメニュー作成JS「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.アニメーションするドロップダウンメニュー作成JS「Sliding JavaScript Dropdown Menu」 デモページはこちら メニューの中身は単なるul li
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
ie以外でもクリップボードが使えるsetClipboard.js IE以外のブラウザでもクリップボードにコピーが簡単にできるjavascriptライブラリを作成しました。 IEにはclipboardData.setDataという関数があり、クリップボードへのコピーなどが簡単にできますが、IE以外のブラウザはクリップボードにアクセスする機能がありません。 そこでflashプレーヤ―のsetClipboard関数を利用してクリップボードにコピーするライブラリです。 まずは関連ファイルをダウンロードします。 ダウンロード(setClipboard.zip) 解凍してできる『setClipboard.js』と『setClipboard.swf』は同じディレクトリにアップしてください。 header要素などでsetClipboard.jsを読み込みます。 <script type="text/jav
JavaScriptでの進捗表示に便利な「jsProgressBarHandler」がアップデート 2008年02月07日- Bram.us jsProgressBarHandler (Dynamic Unobtrusive Javascript Progress/Percentage Bar) jsProgressBarHandler is a Javascript based Percentage Bar / Progress Bar, inspired upon JS-code by WebAppers and CSS-code by Bare Naked App.JavaScriptでの進捗表示に便利な「jsProgressBarHandler」がアップデート。 『進捗状況を分かりやすくプログレスバーで表示できるJSライブラリ「jsProgressBarHandler」』で紹介した
A Quick Introduction to Tamarin Tracing - by Chris Double氏 Webシステム開発用の言語としてJavaScriptが日に日に重要な位置を獲得しつつある。複雑なシステムを開発するとなるとその実行速度が問題視されるJavaScriptだが、コンパイル技術の導入やJITの導入で状況は改善されようとしている。特にFirefox 4で導入が予定されているAdobe Systemsから寄贈されたTamarinはJavaScriptの実行速度を劇的に向上させることになる。 Chris Double氏が3日(米国時間)、同氏のブログにおいてA Quick Introduction to Tamarin Tracingのタイトルのもと興味深いドキュメントを公開た。同氏は同ドキュメントで"tracing jit"と呼ばれる技術を活用した実装"Tamari
「あわせて読みたい」では、実験的にあわせて読みたいサイトリストを RSS および JSONP で配信しています。 RSS 配信 RSS については、あわせて読みたいで表示される各サイトのページ下部に アイコンで表示されています。 配信形式 RSS 2.0 (UTF-8) URL http://api.awasete.com/showrss.phtml?u=(対象となるブログトップページのURL) ※パラメータのURL は URLエンコードする必要があります。 サンプルリクエスト http://api.awasete.com/showrss.phtml?u=http%3A%2F%2Fblog.myrss.jp%2F 制約事項 現在特に制限はありませんが、大量のアクセスおよび If-Modified-Since に対応していないリクエストについては制限をかけることがあります。 JS
コピペブログ騒動史を書き上げるのが面倒なので、逃避するの巻。 #GreasemonkeyはFirefox、UserJSはOperaで使用できます。 #OperaでGreasemonkeyスクリプトが使えるかの動作確認はまだやっていない。動作確認終了。 リンク 同時期に同じ内容の記事を書かれていたので。 ニコニコ動画で使うGreasemonkeyスクリプト - Browser.js 追記 何かしら図書館に所蔵されました。 Greasemonkey ニコニコ動画のコメント熱狂度を可視化する「Heat the nicovideo up」 ニコニコ動画のコメントをタグクラウドっぽく表示する「Nicomment Cloud」 ニコニコ動画のコメントをGoogle Analyticsっぽくグラフ化する「NicoNicoDouga - Analytics」 ニコニコ動画の一覧ページで強調表示する+ニコニ
ニュースのヘッドライン調の表示は格好がいい。ただ一覧表示するのに比べて、表示がダイナミックに切り替わる分、目を引きやすい。 そんな表示をあなたのブログパーツとしていかがだろう。ライブラリを使えば簡単だ。 今回紹介するフリーウェアはPausing RSS scroller、RSSをヘッドライン調にスクロールさせるライブラリだ。ソースは公開されているが、ライセンスは明記されていないので注意して欲しい。 Pausing RSS scrollerは横型と縦型の二つの表示方式をサポートしている。PHPを使って外部のRSSを取得し、それをJavaScriptを使って表示する。 一つの記事ごとに表示が下から上に流れて切り替わる。横型の場合はタイトルだけが良いが、縦型の場合は概要も一緒に表示するようにすると奇麗だ。表示時間や表示項目も設定可能だ。 ただ表示するだけではインパクトが薄いが、スムーズに動かした
jqzoom | allows you to realize a small magnifier window close to the image or images on your web page easily.画像のマウスポインタ上をズームしてくれる「jqzoom」。 次のように、マウスポインタ上の画像を右部分でズームしてます。 小さい画像と大きな画像を指定するので、拡大しても解像度が悪いということはありません。 jQuery ベースで、(1)ライブラリ読み込み (2) img タグ定義 (3) スクリプト初期化 というステップで実装も簡単。 サイトの仕掛けとして覚えておいた方がよさそうなライブラリですね。
Proto.IPS :: In-place-select controls made easy Proto.IPS is a nice little widget which can be used for in place selection. ドロップダウンリストから入力補完できるインプレイスエディタ実装ライブラリ「Proto.IPS」。 テキストをクリックしてそのまま編集できる、というのはよくみますが、ドロップダウンから入力補完できるのははじめて見ました。 Prototype.jsベースで、次のようなコードで簡単に初期化して使えます。 new Proto.IPS(element, { options: [ {text: 'Available', className: 'on'}, {text: 'Free for chat', className: 'on'}, {text: 'Aw
2007年12月07日11:30 カテゴリiTechLightweight Languages WEB API - Google Code Chart キター 久々に使い出のあるAPIが登場! Google Code Blog: Embed charts in webpages with one of our simplest APIs yet Developer's Guide - Google Chart API - Google Code Query Parameterを適当に設定してURIを叩くだけでグラフを描いてくれる。 だから、JavaScriptでグラフを書くのもちょちょいのちょい。 chs cht chxt chxl chd uri ここでサンプルで入れてあるデータは東京の月平均気温そのままなのだけど、見てのとおりExcelみたく正規化まではしてくれない。あくまで下が0で上
AJAX Cross Domain - ACD AJAX Cross Domain is a library that allows to perform cross-domain AJAX requests. クロスドメインなのにAjax出来てしまう仕組み「ACD」。 通常、クロスドメイン間のリモートデータはセキュリティの関係上、読み込めません。 JSONPによるクロスドメインデータ読み込みの裏技も存在しますが、ACDはもっとシンプルです。 例えば次のコードを実行すると、www.google.com のhtml が alert されます。 <script type="text/javascript" src="http://www.ajax-cross-domain.com/cgi-bin/ACD/ACD.js?uri=(//www.google.com)"></script> <scr
(このエントリーは「Javascriptクイズ:無名関数と実行効率の話」の続編。) 「???」と頭をかしげる太郎に、「じゃあ、これだったらどうかな?」と三郎はコードを書き始めます。 function code2name(code) { var mapping = { 'us': 'United States', 'ja': 'Japan', 'ko': 'Korea', 'ru': 'Russa', 'uk': 'United Kingdom', 'fr': 'France', 'cc': 'China', 'gw': 'Germany' }; return mapping[code] || '(unknown)'; } 「カントリーコードを国名に変換しているんですね。」と太郎。 「どこが問題だか分かる?」 「うーん、マッピングのためのオブジェクトを毎回作り直しているところかな。」 「そう
あなたにとって重要なトピックや同僚の最新情報を入手しましょう最新の洞察とトレンドに関する最新情報を即座に受け取りましょう。 継続的な学習のために、無料のリソースに手軽にアクセスしましょうミニブック、トランスクリプト付き動画、およびトレーニング教材。 記事を保存して、いつでも読むことができます記事をブックマークして、準備ができたらいつでも読めます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く