Archive: 2008

ブロック要素の高さを揃える

高さというより下端だけど。

equal-bottom-nに対応する要素の下端を揃える。

$(function() {
  for (var i = 1; $('.equal-bottom-' + i).length; i++) {
    var block = $('.equal-bottom-' + i);
    var height = 0;
    block.each(function() {
      height = Math.max($(this).offset().top + $(this).height(), height);
    });
    block.each(function() {
      $(this).height(height - $(this).offset().top);
    });
  }
});

続きを読む

2008/12/05 12:35 | code

なんちゃってvalign

やはり出来ると便利なので。

$(function() {
  $('div.grid.middle > div.column').addClass('middle');
  $('div.grid.bottom > div.column').addClass('bottom');
  $('div.grid div.column').filter('.middle, .bottom').each(function() {
    var height = 0;
    $(this).siblings().each(function() {
      height = Math.max(height, $ (this).height());
    });
    var margin = Math.max(height - $(this).height(), 0);
    $(this).css('margin-top', ($(this).hasClass('middle') ? Math.floor (margin / 2) : margin) + 'px');
  });
});

続きを読む

2008/12/04 08:01 | code

テーブルのセルの中をいい感じに

<td><ul /></td><td>ほげほげ<ul /></td>、両方ともul:first-childになるのは困ることが多いので:first-node疑似クラスを使えるようにする。

:-moz-first-nodeと同じ。

jQuery.extend(jQuery.expr[':'], {
  'first-node': function(a) {
    var b = a.parentNode.childNodes;
    for (var i = 0; i < b.length; i++) {
      var c = b[i];
      if (c.nodeType == 1) {
        return c.parentNode.getElementsByTagName('*')[0] == a;
      }
      if (jQuery.trim(c.nodeValue)) {
        return false;
      }
    }
    return false;
  }
});
$(function() {
  $('td > :first-node').addClass('first-node-of-td');
});

2008/11/18 16:32 | code

横幅不定のブロック要素を中央・右揃え

要するに横幅を自動で設定してやるだけ。

$(function() {
  $('.left, .center, .right').each(function() {
    $(this).css({
      display: 'block',
      float: 'none',
      width: $(this).css ({ display: 'inline-block', float: 'left' }).width()
    });
  });
});

続きを読む

2008/11/15 11:00 | code

ダイアログを出さずにウィンドウを閉じる

window.open以外の方法で開いたウィンドウをwindow.closeで閉じるときに「ウィンドウは、表示中の…」というダイアログを出さずにウィンドウを閉じる。

将来にわたって問題ないのかどうかはあやしい。

window._close = window.close;
window.close = function() {
  (window.open('', '_top').opener = top)._close();
};
<a href="javascript:window.close();">閉じる</a>

2008/10/13 16:29 | code

Fugue Icons 1.0

いい加減に作るか、ということで1,000個にして バージョン1.0リリース

随分サボったけど4ヶ月でこれなら十分がんばりましたで賞ぐらいは。

2008/10/12 13:00 | icon

検索キーワードに関連するブログ記事リストを表示

JavaScriptで検索キーワードを取得 して、Google AJAX Search API にぶっこむだけ。

例:

当サイト。

  1. Yahoo!とかで「 jQuery 注釈リスト 」などと検索
  2. 検索結果からブログ記事を見る
  3. 右上とか、ホーム とか

検索キーワードはセッションCookieで保持。

※Googleは仕様変更でもう通用しない。

2008/10/02 18:30 | code

JavaScriptで検索キーワードを取得

超適当版。

文字コード周りは Escape Codec Library で。

引数referrerはチェック用。

function getSearchQuery(referrer) {
  if (/[?&](kw|MT|name|p|q|qt|query|search|word)=([^&]+)/.test(referrer || document.referrer)) {
    var query = RegExp.$2;
    return eval('Unescape' + GetEscapeCodeType(query) + '("' + query.replace(/\+/g, ' ') + '")').replace(/^\s+|\s+$/g, '');
  }
  return null;
}

2008/09/30 03:25 | code

SWFObjectとSafari

プラグインを無効にしている場合にもまじめにインストールされているバージョンを返してくれるのだけど、都合が悪いので0を返してくれるように改造。

オリジナル:

...if(navigator.plugins&&navigator.mimeTypes.length)...

改造版:

...if(navigator.plugins&&navigator.mimeTypes.length&&navigator.mimeTypes['application/x-shockwave-flash']&&navigator.mimeTypes['application/x-shockwave-flash'].enabledPlugin)...

2008/09/29 22:35 | code

フィードを読み込む

Google AJAX Feed API とjQueryで簡単に。

google.load('feeds', '1');
google.load('jquery', '1.2.6');
google.setOnLoadCallback(function() {
  var feed = new google.feeds.Feed('http://news.google.com/?output=rss');
  feed.setNumEntries(10);
  feed.load(function(result) {
    if (!result.error) {
      var list = $('<dl/>').appendTo('div#feed');
      $.each(result.feed.entries, function(i, entry) {
        $('<dt>' + entry.publishedDate + '</dt>').appendTo(list);
        $('<dd><a href="' + entry.link + '">' + entry.title + '</a></dd>').appendTo(list);
      });
    }
  });
});
<div id="feed"></div>

2008/09/28 21:38 | code

Categories

Archives

About

こんにちは、上山根 祐輔 (かみやまね ゆうすけ) です。東京を拠点に活動しているフリーランスのデザイナー、デベロッパー、あと何でも屋です。

というか、Fugue Icons の作者、と言ったら分かりやすいかも。