ブロックレベル要素の高さを揃えるheightLine.js Web標準の日々のグループディスカッションで出たライブラリ案を作っていく企画、第一弾。 ブロックレベル要素の高さを揃えるjsライブラリを作ってみました。 このライブラリは新バージョンがあります。 レスポンシブWebデザインに対応した「jquery.heightLine.js」 CSSでは複数のブロックレベル要素の高さを揃えれないという問題があります。 このheightLine.jsは、複数のブロックレベル要素の高さを揃える事ができ、2カラムレイアウトや3カラムレイアウトのそれぞれのカラムの高さを揃えたり、複数のブロックレベル要素をfloatで配置する際の高さを揃えたりできる、便利なライブラリになります。 設置方法 head要素内にダウンロードしたheightLine.jsを読み込みます。 <script type="text/ja
Revision 2.2 Aaron Whyte Bob Jervis Dan Pupius Eric Arvidsson Fritz Schneider Robby Walker This style guide contains many details that are initially hidden from view. They are marked by the triangle icon, which you see here on your left. Click it now. You should see "Hooray" appear below. Hooray! Now you know you can expand points to get more details. Alternatively, there's a "toggle all" at
[2011/03/12追記] 昔の記事だから今は見られていないかなと思ったんですが、それなりにアクセスあるようなので追記。 $('div').myMethod()みたいな感じでmyMethodという自分用の好きなメソッドを生やすのは良いのですが、 複数人でそういうことをやったりするとみんな「myMethod」というメソッド作って衝突してしまうこともあると思います。 jQuery1.5が使えるのであればjQuery.subを使ってmyMethodを閉じ込めてしまい、 衝突を避けるというのが良いかもしれません。 http://api.jquery.com/jQuery.sub/ また、たとえばtooltipに関するメソッドを生やしたい場合に、 pluginの作り方にも書いてある通り、 (function( $ ){ $.fn.tooltip = function( options ) { //
弊サイトにお問い合わせで、テーブルの行を削除または追加しても、自動的に番号を振り直せないかという質問がありましたので、自分なりに考えた結果をご紹介したいと思います。思いついたのはCSSを使った方法とJavascriptを使った方法の2種類です。 CSSを使って連番を振る方法 連番を付けたい箇所にnumberクラスを付けています。 <table class="numbering"> <tr> <td class="number"> </td> <td>あああああああ</td> </tr> <tr> <td class="number"> </td> <td>いいいいいいい</td> </tr> <tr> <td class="number"> </td> <td>ううううううう</td> </tr> <tr> <td class="number"> </td> <td>えええええええ</td
jQueryのプラグインとかを見ていた時に、 なにやら面白そうなプラグインを発見。 「jQuery BlockUI Plugin」 画面全体やもしくは要素に対して、 半透明のレイヤーを表示させてブロックするプラグインだ。 使う機会はでてくるかわからないけど、 とりあえず使って試したくなったので、 勉強のためにメモエントリーしておく。 Login FormRun jQuery('#demo1').click(function() { jQuery.blockUI({ message: $('#loginForm') }); //↓最後の数字が消えるまでの時間(1000=1秒) setTimeout(jQuery.unblockUI, 2000); }); iPhoto (ish)Run jQuery('#demo2').click(function() { jQuery.blockUI({
「Webサイトを作るときに本当によく使う機能を、自分で作らずにさくっと実装したい」――。そんなワガママな願望をかなえてくれる JavaScriptライブラリが登場した。ミツエーリンクスが今月オープンソースとして公開した「MJL(MITSUE-LINKS JavaScript Library)」は、Webサイト制作に必須の“最小限の機能”に絞ったJavaScriptライブラリだ。 昨今相次いで公開されている、リッチなUIを実現するJavaScript/Ajaxライブラリとは異なり、MJLの機能はとてもシンプルだ。もともとWeb制作会社であるミツエーリンクスが「自社標準ライブラリ」として作成したものだけあって、汎用性・実用性を重視したライブラリになっている。 具体的な機能は以下の6つ。確かにどれもよく使いそうなものばかりだ。 画像のロールオーバー Flashオブジェクト埋め込みの機能拡張 新規
jQuery とかで簡単にできるんじゃないかと検索してたら以下のページがヒットした。 http://stackoverflow.com/questions/946534/insert-text-into-textarea-with-jquery http://d.hatena.ne.jp/project_the_tower2/20071228/1198785069 試行錯誤して、以下のサンプルができた。(IE8 と FF3 で確認) <form> <textarea id="area"></textarea> <input type="button" id="insert" value="挿入"> </form> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/jav
Windows OS に PHPとApacheサーバーのインストール ~ php.iniの設定まで、 パソコンでPHPを使えるようになるまでの手順を図解。 .htaccessの指定方法、使用頻度の高いPHP関数をサンプル付きで解説。 Tipsでは実用的な自作関数を紹介。 JavaScriptの基本~実用的な関数までサンプル付きで解説。 ロールオーバー、ウィンドウ操作、連動プルダウン、入力チェック(正規表現含む)など、 サイト制作に使える実用的なスクリプトを紹介。コピペで使えます。 JavaScriptでDOM(Document Object Model)のメソッド・プロパティを使ってページ上のノードにアクセスするサンプルも追加しました。 Ajax ブログやサイトで使える実用的なAjaxをサンプル付きで解説。 HTML5 次世代HTML標準となるHTML5を使ってみよう!HTML5のタグリフ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く