JavaScript、PHP、HTML、CSS など Webサイト制作に関すること
今『jQueryクックブック』を読んでいるんですけど、この本すごくいいですね。こういう jQuery の本が欲しかったんだよな〜という感じで大満足しながら読んでます。 さて、jQuery で要素のスタイルを確認するとき、.css( propertyName ) メソッドを使って値を取得できますね。 例えば、フォントサイズを取得するとき、propertyName は「font-size」でも「fon...
当ブログで公開している「jQuery Multi-checkbox - テキストフィールドを複数選択チェックボックスに変えるjQueryプラグイン」をアップデートしました。 今回のアップデートで、「ラベル名は日本語で、保存される値は英語で」というのが可能になりました。 詳細は以下のページの「label オプションで値を設定する２（ラベルと保存される値を変えたい場合）」をご確認ください。 jQue...
当ブログで公開している「jQueryAutoHeight.js - 複数のカラムの高さを最大値にそろえるjQueryプラグイン」を、フォントサイズが変更されたときにも高さがそろうように使う方法を紹介します。 ボックスの高さをそろえる JavaScript ライブラリといえば、to-R さんの「heightLine.js」が有名ですね。 このライブラリの中で使われているフォントサイズの変更を取得する...
昨日公開した「jQuery Multi-checkbox - テキストフィールドを複数選択チェックボックスに変えるjQueryプラグイン」ですが、少しアップデートしました。 最初の仕様は、<input type="text" /> に title 属性を設定することが前提でした。しかし、CMS の管理画面（主にMTを意識しているんですけど）では、title 属性を設...
昨日の「jQueryでボックスの中の画像の縦位置を中央に揃える」に引き続き、今日も jQuery ネタです。 今日は、普通の input type="text" を複数選択チェックボックスに変えてくれる jQuery プラグインを書いて見ました。選択されたチェックボックスの値が、元のテキストフィールドにカンマ区切りで入力されます。 利用シーンはあまりないかもしれませんが、チェッ...
商品のサムネイルや商品名を入れたボックスを並べて、商品一覧などを作ることって結構あるのではないでしょうか。 そんなとき、写真のサイズが決まっていれば何の問題もありませんが、縦長だったり横長だったりする写真が混在するとき、それらの写真をボックスの中央に配置するのって結構面倒じゃないですか？ 左右中央に配置するのは問題ありませんが、縦を中央に配置するのが結構厄介です。 そこで、そのような場合の縦位置を...
先日公開した「jQueryAutoHeight.js - 複数のカラムの高さを最大値にそろえるjQueryプラグイン」を少しだけアップデートしました。僕のブログにしては、思っていたよりもブックマークされる数が多くて驚いている今日この頃です。...
コメントで以下のような質問を頂きました。 thickboxなど、（loadなどで）読み込んだ部分に対して指定したjQueryが機能しませんでした。 初めからある方は機能し、読み込んだ部分のみ機能しません。 厳密な話は抜きにして、loadなどで読み込んだ部分は、最初に thickbox などを適用させるときにはまだ存在していないため、これらの要素には thickbox などの機能は適用されないんです...
タイトルそのまんまの jQueryプラグインを書いてみました。 このプラグインは、次の２通りの方法で、複数のボックスの高さを自動的にそろえてくれます。 セレクタで指定したすべての要素を、その中の最大値に揃える セレクタで指定した要素を、引数で渡した数ごとに、その中の最大値に揃える この手のプラグインは、すでにたくさん出回っていますが、それぞれのメリットとデメリットを調べるのが面倒だったので、と...
Ajax風（？）なファイルのアップローダーは多々あります。その中でも、この「Uploadify」はかなり使いやすそうです。 画面遷移なしでファイルをアップロードできるのはもちろんのこと、アップロードの進行状況も見られたり、複数ファイルのアップロードにも対応していたりと、非常に良い感じです。また、アップロード完了後やファイルの選択後の振るまい、重複ファイルのチェックなど、色々とオプションの設定が出来...
いや、全然大したものではないのですが、自分が JavaScript のオブジェクトの中身を見たい時に、たまに使っているコードを jQuery のプラグインの形にしてみました。...
なんだか頻繁に絡んで申し訳ないと思いつつも、THE HAM MEDIAさんのところで、「jQuery1.4から追加されたjQuery.proxy()を試してみる」というすごく分かりやすい記事があり、僕も勉強させていただいたので、エントリーしてみます。 jQuery1.4から追加されたjQuery.proxy()を試してみる | THE HAM MEDIA ちなみに、ここではハムさんの記事を読んで...
THE HAM MEDIAさんのところで、JavaScript が ON のときだけ適用させる CSS はどうやって書くのが一番良いんだろうというのを連続して取り上げています。 JavaScript OFF環境に優しく？jQueryでCSSを追加 JavaScript OFF環境に優しく？ その２ JavaScript OFF環境に優しく？ その３ JavaScript OFF環境に優しく...
先日の「facebox.jsを使用してIE6だとセレクトボックスが前面に出てしまう件の対処法」に引き続き、今日も似たようなネタですが、この記事に、次のようなコメントを頂きましたので、その対処法を紹介します。 facebox.jsを使用してIE6だとセレクトボックスが前面に出てしまう件の対処法 - かたつむりくんのWWW ほっとひと安心したところまたひとつ問題が... 調べるとこれもIE6のバグ(未...
昨日、「Facebox 1.2 - LightBox風に角丸で画像をポップアップ」という記事に次のようなコメントをいただいたので、その対処法を考えてみました。 そんな中、もう一つだけ困ったことが出てきてしまいました。 絶対にプルダウンリストが必要な画面で使いたいのですが、 IE6のバグでプルダウンが前面に表示されてしまうのです...。 サンプルにプルダウンを付けてみました。(IE6のみ変なようです...
グローバルナビゲーションやボタン等で、画像を使ってロールオーバーを表現する方法にはいくつかあります。 僕は、以前はCSSでの画像置換によるロールオーバーを使うことが多かったのですが、最近では JavaScript（特に yuga.js）によるロールオーバーが基本になっていました。 しかし、最近、CSSだけでロールオーバーする方法を思いついたので、それをメインに使っています。特に目新しいことをやって...
今日は CSS Nite in Ginza, Vol.31に行ってきます。テーマは「CSSレイアウト：IE 6対応のかんどころ／小林 信次（まぼろし）」ということで、以前「CSS Nite ビギナーズに参加した感想とか要望とか」で書いた「CSS Nite への要望っぽいこと」が実現した感じで、すごく楽しみです。 僕は Web制作の現場にいないので、実務経験が少ないです。ですので、日頃、Web 制作...
長いソースコードや文章を簡単にアコーディオンさせる jQuery のサンプルを作ってみました。 ブログを書いていて、長いソースコードが出てきた場合、それをそのまま pre 要素で掲載しちゃっていいものか迷うときがあります。ソースコードを見て理解したい人には親切だけど、使い方とかだけを見たい人には邪魔だろうなーと。そういったときに、とりあえず非表示にしておいて、見たい人はクリックしてアコーディオンし...
「jQuery でテキストエリア内の文字はどのメソッドで取得する？」と、ちょっと疑問に思ったので実験した備忘録です。 jQuery では、指定した要素の中の文字列は「 .text() 」、指定した要素の中のHTML は「 .html() 」で取得できます。また、input 要素（ type="text" ）の value については「 .val() 」で取得できます。 さて、では textare...
最近、jQuery のセレクタをマスターするのに最適ということで「 Selectors 」というサイトが話題になっています。 実際にそのサイトを使ってみるとかなり良い感じで、ビジュアルで jQuery のセレクタが理解できるので本当に役立ちます。後は実践をこなして練習するのみですね。 さて、その「実践で練習する方法」ですが、ちょっとオススメなのが、 Firefox と Greasemonkey を...