インフォシークのトップページでは、表示させる記事数を調整できるスライダーがついています。 ↑ こんな感じ。 もうちょっと注目記事が見たい、というときに便利そうですね。ちょっとしたことですが、「お！」と思わせるインターフェースで好感が持てるのではないかと。 » 【インフォシーク】Infoseek ： 楽天が運営するポータルサイト
インフォシークの記事表示数を調整できるスライダー | SIMPLE*SIMPLE
インフォシークのトップページでは、表示させる記事数を調整できるスライダーがついています。 ↑ こんな感じ。 もうちょっと注目記事が見たい、というときに便利そうですね。ちょっとしたことですが、「お！」と思わせるインターフェースで好感が持てるのではないかと。 » 【インフォシーク】Infoseek ： 楽天が運営するポータルサイト
「JavaScript でタブ切り替え UI を実装する」を改良してみた - gan2 の Ruby 勉強日記
JavaScript でタブ切り替え UI を実装する | WWW WATCH で紹介されているスクリプトは、 軽いし、ソースも読みやすいしでとても便利。 気になること でも、ちょっと気になることが2つある。 タブが増やしたいときに、スクリプトに自分でセットアップ用のコードを書き足さなくてはならない。 タブをクリックしての切り替えはできるが、アンカータグのリンクからタブを切り替えることができない。 気になることを直すと得られるメリット 1.は大した手間ではないのだけど、 どうせならHTMLを編集するだけで自動的にタブが作られた方が便利。 2.はそんなことできなくてもいいって人の方が多いのかもしれないけど、 僕は以下のように書いたリンクからもタブ切り替えできたほうがうれしい。 <a href="#menu1">Menu1へ飛ぶ</a> デモとソース一式 ってことで、リンク先のスクリプトにちょ
Prototype.jsでiGoogleっぽいポータルな仕組みを作れるJSライブラリ「Xilinus」:phpspot開発日誌
Prototype.jsでiGoogleっぽいポータルな仕組みを作れるJSライブラリ「Xilinus」 2007年08月31日- var portal = new Xilinus.Portal("#page div")Xilinus : Prototype Portal Class I have always wanted to create a Class to handle in a easy way portal page like netvibes. After having tried to used Sortable of script.aculo.us, I decided to write my own Class. Prototype.jsでiGoogleっぽいポータルな仕組みを作れるJSライブラリ「Xilinus」。 Xilinus を使って、次のような、ドラッグ＆ドロ
JavaScript での日付チェック (でぃべろっぱーず・さいど)
年月日のプルダウンがあって、そこで指定された日付が正当なものかどうかJavaScriptでチェックする方法。 日付は Date クラスの引数に年月日を与えれば良いのですが、例えば、 var d = new Date(2007,1,31); //月は0～11の値を取るので、これで2007年2月31日を指定している。 とすると、d は 2007年3月3日となってしまいます。 ということで、これを逆手にとって、 function isValidDate(y,m,d){ var di = new Date(y,m-1,d); if(di.getFullYear() == y && di.getMonth() == m-1 && di.getDate() == d){ return true; } return false; } とすればOK。 ↓一応サンプル。 //
文字サイズの変更を取得するJavaScript
文字サイズの変更を取得するJavaScript heightLine.jsで使用しているのですが、文字サイズの変更を取得するJavaScript。 そういうイベントハンドラがあればいいものの、なさそうなので自作しました。 var e = document.createElement("div"); var s = document.createTextNode("S"); e.appendChild(s); e.style.visibility="hidden" e.style.position="absolute" e.style.top="0" document.body.appendChild(e); var defHeight = e.offsetHeight; checkBoxSize = function(){ if(defHeight != e.offsetHeight){
テキストボックスを伸縮させるjavascript「resizeTextarea」
twitter facebook hatena google pocket ディスプレイの表示領域は使用環境によって異なってきます。 そのため、限れられたスペースを有効活用することが求められます。 Eject MediaではmootoolsベースのresizeTextareaを公開し、テキストボックスの伸縮を可能にしています。 sponsors 使用方法 resizeTextareaからresizeTextarea.jsを、mootoolsからmootools.jsをダウンロードします。 head内にこの2つのscriptを埋め込みます。 <script type="text/javascript" src="http://www.skuare.net/test/js/mootools.js"></script> <script type="text/javascript" src="ht
サイドバーをセクシーに開閉させるjavascript「SlidingSideBar」
twitter facebook hatena google pocket Webデザインを行う際に、見やすさが重要な要素の一つにあげられます。 この観点から言えば余計なものは削除する必要がありますが、サイト開設者としてはどうしても表示したいものがあります。 Andrew SellickのSexy sliding JavaScript side bar menuではデザインにも配慮した開閉式のサイドバーを作成することが出来ます。 sponsors 使用方法 Sexy sliding JavaScript side bar menuのDownloadからダウンロードしても解凍できなかったので以下よりダウンロードしてください。 SlidingSideBar.zip またmootools.jsも必要です。 head内に以下を挿入します。 <script src="http://yourdomai
Hawk's Laboratory » JavaScriptによるUI開発におけるStateパターンの利用
このドメインを購入する。 hawklab.jp 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
[brothercake] Docking boxes (dbx)
Version 3.0 — 26th March 2009 Docking boxes (dbx) adds animated drag 'n' drop, snap-to-grid, and show/hide-contents functionality to any group of elements. And how could I resist re-creating one of the most iconic interfaces of modern times to show it off! The script can work with rows, columns, or two-dimensional grids of objects, of any size and shape. And as you've come to expect from brotherca
テキストフィールドのフォーカス時に背景色を変更する JavaScript
■ テキストフィールドのフォーカス時に背景色を変更する JavaScript 以下の JavaScript を読み込ませれば、フォームのテキストフィールドにフォーカスした時に、背景に色がつくようになります。今どのフィールドを選択しているのかが視覚的にわかるので便利。 mixi にこの機能がついていたんだけど、onfocus なんてのをいっぱい書いていて非効率的だと思ったので、読み込ませるだけで勝手に全部のフィールドに設定されるようなものを書いてみました。 window.onload = function() { var colorful = new ColorfulInput; colorful.set(); } function ColorfulInput() { this.skip = []; this.color = { 'blur': '', 'focus': '#EEEEEE'
最速インターフェース研究会 :: ライブドアのテクノロジーセミナーでしゃべってきました
昨晩はライブドアで開催されたテクノロジーセミナーで「Technologies for UI」という題でプレゼンをやりました。 発表資料はpdfかhtmlで公開する予定ですが、とりあえずテキストだけ先にアップしておきます。 http://ma.la/files/livedoor/seminar2006/seminar.txt プレゼンツールがFirefox専用だったりするので、これも少し手直しして公開予定です。 こういう機会があるたびにプレゼンツールを作ってるような気がします。 ---- 追記:12/15 ライブドアのtechblogの方に発表資料をアップしました。 http://blog.livedoor.jp/techblog/paper/ldtech2006/ 上下カーソルキーでページをめくれます。
フォームの入力内容にツールチップ表示をする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"> そして、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://livsey.org/experiments/textareatools/
君の発売日 - ドラッグで複数のチェックボックスをチェックする
