mattt* / Chroma-Hash: A Belated Introduction
Yesterday, I posted Chroma-Hash, an experiment in how to visualize the live-input of secure fields, such as a password on a login screen. So far, I’ve received a lot of great feedback, as well as a number of questions that I thought deserved a proper response. Before I go into any details, I invite you to check out the live demo, (if you haven’t seen it already), so you can get a clear idea of wha
lockエラー | 月額200円からのレンタルサーバー JSN
auのトップページのような、伸縮してスライドするメニューをjavascript+cssで作れるみたいです。「Image Menu」というライブラリで、動かすにはmootools.jsが必要のよう。 <script type="text/javascript" xsrc="imagemenu.js" mce_src="imagemenu.js" ></script> <div id="kwick"> <ul class="kwicks"> <li><a class="kwick opt1" xhref="" mce_href="" ><span>TOP</span></a></li> <li><a class="kwick opt2" xhref="" mce_href="" ><span>CSS</span></a></li> <li><a class="kwick opt3" xhref
忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」:phpspot開発日誌
BlueShoes: JavaScript Collection Get all the above components in one package. There is an example that uses most of the components.忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」。 既に紹介したと思っていたJavaScriptライブラリであるBlueShoesの紹介。 ご存知の方も多いと思いますが、知らない人も多いようですね。 ライブラリ、というより、リッチなコンポーネント集といったイメージで、次のような様々なコントロールが使えます。 WYSIWYGエディタ Excel風スプレッドシート ツリービュー スライダーコントロール 他にも下記の様々なリッチコンポーネントが使えます。 入力系コンポーネ
.htaccess ファイルを簡単作成「.htaccess Editor」
リダイレクト Fromにサイトパスを入力、ToにURLを入力 301 Moved Permanently 恒久的に移動 From: To: From: To: From: To: 302 Moved Temporarily 一時的に移動 From: To: From: To: From: To:
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」:phpspot開発日誌
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」 2006年10月22日- Tooltip for forms You can download the entire script from this Zip file フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」。 このライブラリを利用すれば、次の画像のようなツールヒントをフォーム上に出すことが可能です。 実装は、必要なライブラリを読み込んだ後、次のように、tooltipText 属性にヒントを書きます。 <input type="text" id="firstname" name="firstname" tooltipText="Type in your firstname in this box"> そして、
CSSとJavaScriptでアニメーションがカッコいいメニューを実装「FreeStyle Menus」:phpspot開発日誌
CSSとJavaScriptでアニメーションがカッコいいメニューを実装「FreeStyle Menus」 2006年10月04日- FreeStyle Menus Demonstration This script is a highly flexible means of converting HTML content into powerful popup menus, using either nested lists or DIV tags for menu data, and following best practice guidelines for powerful and accessible menus. CSSとJavaScriptでアニメーションがカッコいいメニューを実装「FreeStyle Menus」。 ブラウザ上で動くWindowsのメニュー風のUIは結構見かけ
技術メモ帳 - Iframe の designMode="on" によるリッチテキストエディット
こんな属性があるのを知らなかった。 実際には、Iframe の属性ではなさそうだが。 どうも、javascript で以下のように指定してあげる事により、 リッチなテキスト編集機能が有効になるようだ。 iframe.contentDocument.designMode = "on"; ちょっとサンプルを作ってみた。 選択範囲の色変えたり、画像貼付けたり出来ます。 http://gomibako.hahaue.com/rth.html (Firefox only) 実際に文字の状態を変化させたりしたい場合は、 同要素の execCommand メソッドを使用すればよい。 たとえば、文字を太字にしたい場合は、 以下のように指定するだけで良い。 iframe.contentDocument.execCommand("bold",false,null); 色を赤くしたければ、 iframe.con
ドラッグ＆ドロップが簡単に出来るJavaScriptライブラリまとめ:phpspot開発日誌
Ajax Digest // Drag&drop javascript libraries review ドラッグ＆ドロップが簡単に出来るJavaScriptライブラリまとめ。 DHTML Goodies デモ DOM Drag デモ Walterzorn Drag&Drop デモ X Library デモ Drag-and-Drop extension for Prototype デモ Toolman DHTML デモ Rico デモ DragLib デモ Yahoo User Interface Library デモ script.aculo.us JavaScriptのライブラリは単純に機能がいいというだけではなく、動作の軽さ、ファイルサイズの軽さも気になる点ですね。 それぞれに性質があって出来る/出来ないことがあったり、コーディング方式が自分のスタイルにあっているとかもあって選択肢
Reflection.js
Reflection.js allows you to add reflections to images on your webpages. It uses unobtrusive javascript to keep your code clean. It works in all the major browsers - Internet Explorer 5.5+, Mozilla Firefox 1.5+, Safari, Google Chrome and Opera 9+. On older browsers, it'll degrade and your visitors won't notice a thing. Best of all, it's under 5KB. Reflect-o-matic See what reflection.js looks like o
Ajaxload - Ajax loading gif generator
Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
Lightbox 2
Overview Lightbox is a simple, unobtrusive script used to overlay images on the current page. It's a snap to setup and works on all modern browsers. What's New in Version 2 Image Sets: group related images and navigate through them with ease Visual Effects: fancy pants transitions Backwards Compatibility: yes! How to Use Part 1 - Setup Lightbox 2 uses the Prototype Framework and Scriptaculous Effe
Ajaxな有用コンポーネント集:phpspot開発日誌
TurboWidgets, presented by TurboAjax Group TurboWidgets are JavaScript client-side controls that provide a rich user-interface experience for AJAX-style web applications. 以前紹介した、AjaxなphpMyAdmin のページで、TurboWidgetsというAjax部品集がリリースされていたので紹介。 例えば、次のイメージはTurboGridというコンポーネント。かなりクオリティ高いです。 その他にも、次のようなプログレスバー(ぐんぐん伸びるイメージがカッコいい) 高品質なボタンコンポーネント集(一見デスクトップ風) ツリービュー(アイコン表示できる) タブコンポーネント(Appleのサイトっぽい) ドラッグアンドドロッ
秋元@サイボウズラボ・プログラマー・ブログ: Yahoo! UI Library はすごいね
via O’Reilley Radar Yahoo! UI Library で、Yahoo! が実際に使っている Javascript のライブラリ集が公開されている。 Yahoo! のどこでこんなユーザインタフェースが使われてるんだろう? と思うぐらい、サンプルで見せられる UI パーツは豊富だ。それぞれの “Example” を見てまわるだけでもおなかいっぱいだ。 コアユーティリティ アニメーション クロスブラウザ対応の XMLHttpRequest ラッパ DOM 操作 ドラッグアンドドロップ イベントハンドリング UI コントロール部品 カレンダー スライダー ツリー ドラッグアンドドロップなんかは、ファンタジースポーツで使われているのを見たことがあるので知っていた。複数のリスト間でアイテムの移動や並べ替えを行うときには使えるパーツだろう。 日本語カレンダーなんかも、いい感じで再利
The Yahoo! User Interface Library (YUI)
YUI Library Controls/Widgets: AutoComplete Button Calendar Charts [experimental] Color Picker Container (including Module, Overlay, Panel, Tooltip, Dialog, SimpleDialog) DataTable ImageCropper Layout Manager Menu Rich Text Editor Slider TabView TreeView Uploader [experimental] YUI Library CSS Tools: CSS Reset (neutralizes browser CSS styles) CSS Base (applies consistent style foundation for c
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Lace - Ajax Chat