最も簡単な画像のロールオーバー導入方法｜JavaScriptプログラムメモ｜プログラムメモ
■ jQuery用プラグイン jQuery_auto を使用します。 prototype.js とのコンフリクト解消版 jquery_auto はこちらからダウンロード↓ http://logic.stepserver.jp/data_other/jquery_auto_j.zip ■ 1. scriptファイルを読み込ませます <script type="text/javascript" src="js/lib/jquery.js"></script> <script type="text/javascript" src="js/lib/jquery_auto_j.js"></script> ■ 2. ロールオーバー画像ファイル名の最後に _over をつける。 例： 【image.gif】 の場合 【image_over.gif】 ■ 3. HTMLの＜img＞タグに属性 class=
ヨモツネット 実験室 » フォームに入力された全角文字を自動で半角に変換する
このスクリプトに機能を追加した valueconvertor.js を公開しています。アーカイブとしてこの記事は残してありますが、この replaceascii.js 機能をご利用する場合は、より安定している valueconvertor.js のご利用をおすすめします。 概要 フォーム入力時に『半角英数で入力してください』の項目があった場合、ユーザの入力ミスを少なくしてあげるために便利なスクリプトです。 ただし、JavaScript が使えない環境では動作しませんので、あくまでもオプションとしてお使いください。 動作確認用の DEMO ダウンロード 使い方 ダウンロードした replaceascii.js を XHTML ファイルの head 要素内などで読み込んでください。 このとき、replaceascii.js と読み込む XHTML ファイルの文字コードが同じになるようにしてくだ
[J] JavaScript と CSS でウェブサイトを印刷対応にする方法
海外の際とで時折見る Printer-friendly version とか print (view print page) などの印刷用にデザイン・レイアウトし直したページの表示機能。 実装例としては以下のあたり。 Gap Inc New York Times プレスリリースや各記事のページに行くとページ上部に Printer-friendly version, print などのテキストリンクが見つかる。 New York Times のそれは、ソースの内容 HTML の head の部分が書き換わっているので URL の拡張子は .html だけどパラメータを読み込んでサーバーサイドのプログラムが動いているんじゃないかと。 っで、今回は JavaScript と CSS でお手軽に実装したいのでいくつかのソースを覗いてみた。 Gap Inc の場合 先に紹介した Gap Inc は
JavaScriptライブラリの先駆け「prototype」を勉強しなおすサイト20
twitter facebook hatena google pocket 現在JavaScriptライブラリは数多くリリースされていますが、それらのさきがけとなったのは「prototype」でした。 またNASAのサイトでも使用されているように、その実力は広く認められています。 今回はprototypeの価値を見直し、勉強できるサイトを紹介します。 sponsors Reference ・prototype.js リファレンス（v1.4.0,1.5.x,1.6.0） ・prototype.js の開発者向けメモ：（v1.5.0） ・prototype.jsリファレンス HowTo / Review ・第１回：Prototypeライブラリの内部 ・いまからはじめるPrototype.js ・第１回：Prototype.jsを使う準備 ・Prototype.jsとは何か ・Prototype
offspring.js | ユージック
offspring.js 更新日：2008年2月6日｜公開日：2008年2月6日 追記 指摘がありました。 offspring.jsがあっても、IE6とIE7でCSSの擬似クラスを使えないとの事です。 このライブラリはIEのcss実装の不備を補完するものじゃなく、最初の子要素に自動的に追加されます。クラスが追加されるだけで擬似クラスをjsで実装してるわけではないようです。offspring.jsを読み込んでも、cssファイルに書いた、:first-child{….}はie系では無視されます。offspring.jsの作者は、ブラウザ間で実装の有無がある:first-childのような擬似クラスは「使わない」ことを提案しているようです。 今現在、CSSの擬似クラスをサポートしているのはSafari 3だけらしいのですが、IEなどでもCSSの代替え策として最初の子要素に自動的にclassを追加
[JS]パネルをフェードや加減スクロールで切り替えるスクリプト -wSide
wSideは、パネルの切り替えにフェードや加減スクロールなど多彩なアクションを実装するスクリプトです。 wSide, plugin jquery wSideはjQueryのプラグインで、動作にはjquery.jsが必要です。 切り替え時の多彩なアクションは、デモページを参照ください。 シンプル デモ 縦方向・横方向への加減スクロール、フェード エフェクト付き デモ 反動付きスクロール、縦横斜めのスクロール アドバンス デモ CSSを利用して、さまざまな効果を狙ったパネルの切り替え
[JS]ページ内をスムーズにスクロールできるスクリプト：更新- 3.0.1
ページ内をスムーズにスクロールできるスクリプト：Page Scrollerの最新版「3.0.1」をリリースしました。 スクリプトの詳細やダウンロードは、下記よりどうぞ。 簡単に設置できるページ内をスムーズにスクロールできるスクリプト -Page Scroller ver.3 主な変更点は、下記の通りです。 3.0.1 スクロール中のマウスのクリックに対して、スクロール動作が止まるようにしました。 スクロール中の別のアンカーへのクリックに対して、スクロール動作が止まるようにしました。 jQuery 1.2.1に対応しました。 ファイル名を「page-scroller.js」から「jquery.page-scroller.js」に変更しました。 実際に使用する際は、どちらのファイル名を使用しても問題ありません。
![[JS]ページ内をスムーズにスクロールできるスクリプト：更新- 3.0.1](https://cdn-ak-scissors.b.st-hatena.com/image/square/bc54860ba06deaa45382cf2bddc929515def0354/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fshared%2Flogo-2014050501-en.png)
JavaScriptでクッキーを超簡単に使うライブラリ「Cookie Manager」:phpspot開発日誌
PHPから使えるprototype.jsとscript.aculo.usのラッパークラス「Projax」 次の記事 ≫：WEBマスター/WEB開発者、御用達のサイトリンク集 Cookie Manager | Javascript Code | All Things Webby Initialisation of a CookieManager object: JavaScriptでクッキーを超簡単に使うライブラリ「Cookie Manager」。 JavaScriptでクッキーを扱うのって、いちいちクッキーをパースして面倒だ、と思っていた人は多いのではないでしょうか？ CookieManager.jsを使えば、phpでcookieを使うときみたいに簡単にcookieが使えます。 prototype.jsをベースとしていて、サンプルのコードは次のような感じになります。 サンプルはクッキーを使
MOONGIFT: » 高機能なテーブルソート「Nofunc Table Organize」:オープンソースを毎日紹介
業務システムをWebベースで作り変える、なんてプロジェクトは多々存在する。業務システムの特徴としては、検索結果や一覧表など、様々な場面でテーブル組の表が利用されることだ。 そして、その中でも厄介なのがデータのソートではないだろうか。検索条件を保存しながらソートして…なんていちいち実装するのは大変だ。そこで検討したいのがJavaScriptによるソート処理だ。 今回紹介するオープンソース・ソフトウェアはNofunc Table Organize、JavaScriptベースのテーブルソートライブラリだ。 Nofunc Table Organizeの特徴としては、既存のテーブルタグをほとんど修正することなく利用できるという点がある。ヘッダ部分はtheadタグで囲み、データ部分はtbodyタグで囲む必要があるがそれ以外は殆ど修正が不要だ。 ソートはヘッダ部をクリックすればできる。昇順、降順の切り替
ソースがシンプルなJSによるロールオーバー｜CSS HappyLife
Webは略語じゃないのに「WEB」って書く人が多いのが気になって仕方ない今日この頃。（あ、音声ブラウザを配慮したらという場合です） さて、本題に。 CSSのみでロールオーバーするテクニックは有名でございますが、ココ最近JSでいいじゃん。と思うようになってます。 ってことで、こんなサイト名ですけどJavaScriptでやるロールオーバーの方法のひとつでも。 jsファイルのご用意 何はともあれ、下記のjsファイルをご用意します。 function smartRollover() { if(document.getElementsByTagName) { var images = document.getElementsByTagName("img"); for(var i=0; i < images.length; i++) { if(images[i].getAttribute("src")
MOONGIFT: » 絶対お勧め！JavaScriptでテーブルソート「Table Sorter」:オープンソースを毎日紹介
Web開発の現場において、データの並べ替え機能の要望は良く出る話だ。開発がある程度終わった段階で言われたりするとショックを受ける事もある。検索条件をパラメータで引き継いで、ページ番号も…なんて考えただけでも嫌になるだろう。 そんな経験のある、またはこれから経験するであろう方にお勧めのソフトウェアがある。これさえ使えばソート処理は怖くない。 今回紹介するオープンソース・ソフトウェアはTable Sorter、JavaScriptのみで実現するソートライブラリだ。 この手のライブラリはこれまでいくつかあったが、iframeを使ったり、表示に特定の手法が必要だったりと、そのままでは使いづらいものが多かった。Table Sorterはそれらの完成版ともいえるかも知れない。 何せ、読み込むのはJavaScriptファイル一つだけ、さらに普通のテーブルタグに対して、ヘッダ部分はtheadタグとthタグ
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
5. 自分のページ（およびcookies）がSafariにキャッシュされるのを防ぐにはどうすればよいのでしょうか？ - Safari Developer FAQ
JavaScriptオブジェクトの、お使いのブラウザの値を表示してみてください： navigator. 先頭に戻る 3. SafariはDHTMLをサポートしていますか？ Safariは、JavaScriptを介してページ上のほとんどの要素にアクセスできる、W3C DOM-2を通じてDHTMLをサポートしています。詳細については、アップルインターネットデベロッパ向けの、DOM-2の使用に関する2つのパートからなる記事、Part IおよびPart IIを参照してください。 DHTMLがサポートされているかをスクリプトを使用してテストする場合は、document.getElementByIdメソッドをチェックします。Mozilla、Internet Explorer 5+、その他最新の各種ブラウザもこれをサポートしています。 if (document.getElementById)
JavaScriptist - javascript/ajax/サンプル/入門/リファレンス/ライブラリ
サイト更新情報 2006/12/06 よく使われているページを検索窓から簡単に辿れるようにしました。(検索窓に「prototype」と入力) 2006/11/27 JavaScript入門/応用サイトJavaScriptistオープン！ 2006/11/23 試して確認できるJavaScriptオンラインエディタを公開 2006/11/20 JavaScriptリファレンス、逆引きサンプル集を公開 2006/11/19 JavaScriptライブラリ活用ページ公開 2006/11/15 JavaScriptistベース機能の構築完了 過去のサイト更新情報
AjaxZip 2.0
Kawa.netxp AjaxZip 2.0 - Ajax郵便番号→住所自動入力フォーム（CGI不要版） AjaxZip2は、昨年公開した 『ajaxな住所入力フォーム』 の新バージョンです。 郵便番号を入力すると、該当する都道府県名・住所が自動的に入力されます。 Ajaxと JSON フォーマットを利用するJavaScriptライブラリとして公開しました。 JavaScript のみで稼動するため、サーバサイドで稼動するCGIプログラムは不要です。 郵便番号→住所変換処理は全てクライアントサイドのJavaScriptで行います。 既存 HTML の住所入力フォームをたった3行書き換えるだけで利用できます。 簡単に設置できるため、プログラムに詳しくない方でも導入していただけると思います。 以下の住所入力フォームに、7桁の郵便番号を入力してみてください。 【2007/12/09 追記】 jQ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[JS]フロートウインドウを生成するスクリプト -Mocha
http://youmos.com/news/dfsmoothscroll