カラフルなボタンからdisabled状態のものまで、様々なボタンがありました。 Webkitに対応しているとの事なので、iPhoneやAndoroid用サイトにうってつけですね。 使い方 使い方は簡単で、CSSを読み込み後にクラスを指定するだけになっています。 Title 個人および商用利用も可能との事。 覚えておいて損はなさそうです。
そのまんまなのですが、プログレスバーがCSS3で実装されています。 これをJSで読み込み処理中に使ってあげると、プログレスバーが実装できるようになりますね。 ダウンロードは下のリンクからどうぞ。
特定の用途だけに特化したフレームワークが必要な場合、シンプルなもので良いのではないだろうか。 「microjs」では、DOM構築後のタイミングで処理を実行したいだけのフレームワークやBase64処理をするだけの物、ブラウザ判別するだけの物など、 ちょっとした時に使えるフレームワークが50以上揃っています。 以下にいくつか気になった物をご紹介。 domReady DOM構築後のタイミングで処理を実行場合に使えます。0.2KB。 domReady(function () { // dom is loaded! }); Base64.js Base64処理ができます。0.9KB。 Bowser ブラウザ判別したい時に。0.2KB。 if (bowser().msie && bowser().version <= 6) { alert('hello China'); } Micro-Templat
いまやFirebugはWeb開発には必須の拡張機能ですが、Flashでも使いたいという方のために「FlashFirebug」という物がありました。 AS3で作れらたFlashのデバッグが、HTMLやJSをデバッグするように簡単に作業できるようになりそうです。 アドオンをインストールすると、FirebugにFlashパネルが追加され、閲覧ページ内のFlashをデバッグできるようになります。 Firebugのようなデバッグ ↑SWFにマウスオーバーした際に、HTMLのように要素を表示してくれます。 ↑YouTubeのサイトで、パラメータを操作している様子。 ↑エラーやトレースの出力ももちろん可能に。 これは開発が楽になりそうですね。 利用にはFlash Debug Playerバージョン10以上が必要との事。 ダウンロードは下のリンクからどうぞ。
「PaRSS」はRSSフィードを取得して動的に表示してくれるプラグインです。 Webサイトとは別にブログを持っている方に良さそうですね。 使い方 HTML JavaScript $("#feed").PaRSS( "http://www.your-blog.com/feed", // feed url 5, // 取得するアイテムの数 (optional) "M jS g:i a", // 日付のフォーマット (optional) true // descriptions (optional) ); 日付のフォーマットはPHPで使える形式であればほぼ使用できるようです。 見た目の変更方法 RSSは<li>タグで出力されるようですが、項目毎にclassが割り振られているようで、CSSをカスタマイズするだけで見た目の変更が可能です。 出力されるHTML ・タイトルが囲まれるタグ ・日付が囲まれ
JavaScriptでログを表示するのに使えるライブラリ「Blackbird」のご紹介。 出力したいメッセージを指定するだけできれいに整形して表示してくれます。 例えば、以下のようなJavaScriptを実行してみます。 log.debug( 'this is a debug message' ); log.info( 'this is an info message' ); log.warn( 'this is a warning message' ); log.error( 'this is an error message' ); ↑すると、こんな感じで素敵に表示してくれちゃいます。 アイコンと色で視覚的にメッセージを区別することができるので、後から見分けるのも簡単です。 使い方 使い方は簡単で、ファイルをダウンロードした後、headタグ内でJSとCSSを読み込むだけでOKです。 <
フラッシュでもアニメーションさせる際に使える手法ですが、それをjavascriptで実現する事が可能になってます。 デモでは円の動きやジグザグな動きを実現しています。 デモ ベジェ曲線上を移動させる事ができるようですね。 こういったアニメーションがGUIで作れたらデザイナーの方はもっとjavascriptを好きになるんじゃないかぁといつも思ってしまいます。 アニメーションに興味のある方はダウンロードしてみてください。
HTML5になってFormの要素が大幅に増えました。inputのtype属性にtel、url、emailなどの値が指定できたり必須属性を設定できたりするので、使いこなせれば便利になりますね。 しかし複雑なチェックやエラー表示のデザインを変更するにはJavaScriptを使う必要があります。 「jQuery Tools」を使う事で簡単に解決する事が可能になってます。 基本的なチェックは1行コードを追加するだけでできるようになるようです。 $("#myform").validator(); エラーメッセージのカスタマイズはCSSで実装できるとの事 /* error message */ .error { height:15px; background-color:#FFFE36; border:1px solid #E1E16D; font-size:11px; color:#000; pad
ガントチャートは現在のタスク、進捗率や実働日数を確認するのに便利に使っています。 全体のスケジュールの確認にも使えるので、何かと手放せません。 そんなガントチャートをHTML5とjavascriptだけで作ってしまった方がいるようです。 「dhtmlxGantt」はHTML5で作られたガントチャートです。 タスクにマウスオーバーすると現在のタスクの状況を詳しく表示してくれます。 データにはXMLが使用されており、保存にも対応しているとの事。 IE, FireFox, Operaで動作できるようですね。 スケジュール管理ができるガントチャートは様々なものがありますが、ウェブブラウザで確認できるようになると便利ですね。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く