yuga.jsって？ ウェブサイトを作る上で面倒な部分を自動で実装したり、ちょっとした機能を簡単に追加したりするJavaScriptです。jQueryを使って作られています。Web制作を優雅にするために作られました。 設置方法 まず、ファイル一式をダウンロードし、読み込みたいサイトの任意のフォルダに配置します。 yuga.jsを使いたいHTMLファイルのhead要素でjavascriptを読み込みます。 <link rel="stylesheet" href="css/thickbox.css" type="text/css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/thickbox.js"></s

Gallerifficは、サムネイル箇所もオートプレイに対応した、シンプルな画像ギャラリーのスクリプトです。 Galleriffic 画像ギャラリーの機能は、サムネイル画像からの拡大表示、マニュアルとオートプレイを備えており、拡大した各画像にはダウンロード用のリンクが表示されます。 GallerifficはjQueryのプラグインのため、動作にはjquery.jsが必要です。 次のバージョンでは、タイトルや説明文の表示機能がつくとのことです。

セレクトボックスのユーザビリティを劇的に向上できるかもしれないjQueryプラグインです。バージョンアップでjQuery.selectable.jsからjQselectableに名前が変わりました。 サンプルを見てみる トピックス 特徴 ダウンロード 導入方法 スタイル 拡張 表示形式 selectable simpleBox エフェクト 透明度 プルダウン位置の調整(少し高度な設定) プルダウンの高さ カスタマイズ 独自のselectボックスに適用させる id、classの引継ぎ 日付で使う Callback関数を使う 動的にselect要素のDOMを書き換える場合（rebuildメソッド） サンプル 更新履歴・追記 動作環境 特徴 selectボックスの選択ってイライラしないですか？jQselectabeを使えば解決できるかもしれません。以下が主な特徴になります。 セレクトボックスの鬱

jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );

Kawa.netxp AjaxZip 2.0 - Ajax郵便番号→住所自動入力フォーム（CGI不要版） AjaxZip2は、昨年公開した 『ajaxな住所入力フォーム』 の新バージョンです。 郵便番号を入力すると、該当する都道府県名・住所が自動的に入力されます。 Ajaxと JSON フォーマットを利用するJavaScriptライブラリとして公開しました。 JavaScript のみで稼動するため、サーバサイドで稼動するCGIプログラムは不要です。 郵便番号→住所変換処理は全てクライアントサイドのJavaScriptで行います。 既存 HTML の住所入力フォームをたった3行書き換えるだけで利用できます。 簡単に設置できるため、プログラムに詳しくない方でも導入していただけると思います。 以下の住所入力フォームに、7桁の郵便番号を入力してみてください。 【2007/12/09 追記】 jQ

Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 タブ・メニュー作ってみました。使いまわしを考慮してパッケージ化に挑戦。JavaScriptを切っているときは、ページ内リンクとなります。 HTML <ul id="tab"> <li class="present"><a href="#page1">Page_1</a></li> <li><a href="#page2">Page_2</a></li> <li><a href="#page3">Page_3</a></li> <li><a href="#page4">Page_4</a></li> <li><a href="#page5">Page_5</a></li

CSS と JavaScript でタブ切り替えを実現しています。 なるべく CSS や JS の記述量を最小にするように努力しました。 もっとシンプルにできそうなアイディアがございましたらご教示下さい。 「無償・無保証・著作権放棄」 ですので、 このページのソースを適当にいじって自由に使って下さい。 全てのタブの中味は 1 つの HTML ファイル (このファイル) に書いてあります。 見出しのクリックにより、表示の ON/OFF を切り替えるだけ、という仕組みです。 タブの見出しをクリックするたびにサーバーを読みに行くのが 欝陶しく思えるときに、うってつけかと。 そう言えば、某サイトでは、クリックどころか、 タブの見出しにマウスカーソルを合わせるだけで、 フォーカスされていることを表す見出しの画像 (背景色が異なるだけ) を いちいち Web サーバーへ取りに

<form><input type="button" value="表示切替" onClick="checkExpand('text');"></form> <span id="text">あいうえお</span> <script language="JavaScript" type="text/JavaScript"> <!-- /**************************************************************** * 機　能： オブジェクトの表示非表示を制御する 1 * （表示している場合は非表示、非表示の場合は表示） * 引　数： ch 表示/非表示を切り替えるオブジェクト名 * 戻り値： なし ****************************************************************/ functio

アップロードフォームに画像のプレビューを出すことが可能です。 IE6では、動作確認が取れたけど、firefoxではできなかった。 <script type="text/javascript"> function preview_image(obj_image, image_id) { document.getElementById(image_id).src= obj_image.value; document.getElementById(image_id).style.display="inline"; } </script> <style type="text/css"> #preview_img_1{ display: none; width: 150px;/*サムネイルサイズ*/ } #preview_img_2{ display: none; width: 150px;/*サム

第 10 回 CSSで文字サイズを変更するボタンを設置する 第 10 回目は「CSSで文字サイズを変更するボタンを設置する」です。 今回の文字サイズの変更は「styleswitcher.js」を使います。 この「styleswitcher.js」は複数のスタイルシートファイルを切り替えて読み込むことができ、クッキーに保存できる優れもののライブラリです。 実装手順は以下の通りです。 1. styleswitcher.js をダウンロード 「styleswitcher.js」をサイトからダウンロードしてきます。 「A List Apart: Articles: Alternative Style: Working With Alternate Style Sheets」のエントリーの中にある Download styleswitcher.js から Download できます。ファイル名 「s