たつをさんのCSS と JavaScript でタブ切り替えをprototype.jsを使って書き直しました。 極力、再利用が簡単になるようにしてみました。 ライセンスは本家の「無償・無保証・著作権放棄」に準じます。 ご自由にお使いください。 サンプルはこちらからダウンロードできます。 基本コードは以下のようになっています。 <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="tabMaker.js"></script> <link href="tabMaker.css" rel="stylesheet" type="text/css" /> <div id="tabContent"> <ul id="tabIndex"> <li class="tab
JavaScriptの開発環境、要するにJavaScript用IDEという位置づけなのですが、HTML、CSSの構造をアウトラインで示してくれたり、文法の間違いを指摘してくれたり、やっていることはほとんどDreamweaverの持っている機能と同じです。 特に面白いのはJavaScriptやCSSなどがInternetExplorerとFirefoxに対応しているかどうかが一発で分かる点。JavaScriptのエラーについても細かい部分まで指摘してくれます。つまり、実行しなくてもエラーがドコにあるのか分かる「静的解析」が可能というわけ。 Windows、Macintosh、Linux版があり、Eclipseプラグインとして動作するバージョンもあります。 スクリーンショットや実際に動かして機能を解説しているムービー、ダウンロードは以下から。 Aptana: The Web IDE http:
外部サイトへのリンク文字列の上にマウスが来ると、自動的にリンク先のページをサムネイルで表示するという面白いスクリプトです。 例と設置方法は以下から。 例としてはこんな感じです。 http://lab.arc90.com/tools/linkthumb/ コードのダウンロードと使い方などは以下の通り。 arc90 lab : tools : Link Thumbnail http://lab.arc90.com/2006/07/link_thumbnail.php 互換性はInternet Explorer 6.0以上、Mozilla Firefox 1.5以上、Apple Safari 2.0、Opera Version 8.51以上であるそうです。 ちゃんと外部サイトのみ判別し、自サイト内ではいちいちサムネイルを表示しないようにできます。
「curvyCorners」はフリーのJavaScriptで、角が丸いコーナーをDIV要素で簡単に作ることが可能。特徴は画像を使ったのと同じくらい角がなめらかに丸くなる点と、いたって利用が簡単な点。 どれぐらい丸くなるのかという実例とコードのダウンロード、設置方法は以下を参照。 例その1、3ピクセルの白いボーダーを使い、角は半径20ピクセルで丸くなってます 例その2、固定幅と高さで画像を固定し、角は半径20ピクセルで丸くしている例 ダウンロードはこちらから 使い方は以下を参照 http://www.curvycorners.net/ ほとんどのメジャーなブラウザをサポートしているので汎用性も高く、使い勝手もいい感じです。
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
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く