Archive: 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

olをulに

olだとリストマーカー周りがコントロールしづらいので。

こいつもjQueryで (JavaScriptの後半とCSSは これ と同じ)。

$(function() {
  $('ol').each(function() {
    $('<ul class="order"></ul>').insertAfter(this).append($.each($(this).children(), function(i) {
      return $(this).prepend('<span class="marker">' + (i + 1) + '.</span>');
    }));
    $(this).remove();
  });
  $('span.marker').parent().parent().each(function() {
    var marker = $(this).children().children('span.marker');
    var width = 0;
    marker.each(function() {
      width = Math.max(width, $(this).css('display', 'inline').width() - parseInt($(this).css('text-indent')));
    });
    var margin = (parseInt(marker.eq(0).css('margin-right')) + width) + 'px';
    $(this).css('margin-left', margin);
    marker.width(width).css('margin-left', '-' + margin);
  });
});

続きを読む

2008/05/16 19:36 | code

アイコンとかを入れると狭くなる行間をいい感じに

要するに、heightmarginを足したものがline-heightと同じになっていればいい。

というわけで、jQueryでいい感じに (expressionでもいいけど)。

$(function() {
  if ($.browser.msie && $.browser.version < 7) {
    $('img.icon').each(function() {
      var margin = Math.max(0, (parseInt($(this).css('line-height')) - $(this).height()) / 2);
      $(this).css({ marginBottom: Math.ceil (margin) + 'px', marginTop: Math.floor (margin) + 'px' });
    });
  }
});
img.icon {
  vertical-align: middle;
}
ほげほげほげほげほげ<img class="icon" ... />

2008/05/15 11:22 | code

注釈リストとかのハンギングインデントをいい感じに

あるいは突き出しインデント。

「注1) ~」に合わせてtext-indentを決め打ちしたはいいが「注10) ~」で破綻したり、「注10) ~」に合わせてmargin-leftwidthを決め打ちしたはいいが「※ ~」のときスカスカ、なんていうのはみっともない。

というわけで、jQueryでいい感じに。

$(function() {
  $('span.marker').parent().parent().each(function() {
    var marker = $(this).children().children('span.marker');
    var width = 0;
    marker.each(function() {
      width = Math.max(width, $(this).css('display', 'inline').width() - parseInt($(this).css('text-indent')));
    });
    var margin = (parseInt(marker.eq(0).css('margin-right')) + width) + 'px';
    $(this).css('margin-left', margin);
    marker.width(width).css('margin-left', '-' + margin);
  });
});

続きを読む

2008/05/14 22:20 | code

Categories

Archives

About

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

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