mayokara note

< Newer
Older >

IE6でabbr要素を使えるようにする

元ネタはie7-js。JavaScriptを無効にしていると機能しません。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="Content-Style-Type" content="text/css">
  <meta http-equiv="Content-Script-Type" content="text/javascript">
  <title>ie6-abbr-fix</title>
<!--[if IE 6]>
  <script type="text/javascript">document.createElement("abbr");</script>
<![endif]-->
  <style type="text/css">abbr { background-color: yellow; }</style>
</head>
<body>
<h1>ie6-abbr-fix</h1>
<p>sample: <abbr title="abbreviation">abbr</abbr> element</p>
</body>
</html>

head要素内でdocument.createElement("abbr");を空呼びするだけで正しく認識される。

rb要素などにも応用できそう。

追記

はてなブックマーク - IE6でabbr要素を使えるようにする - mayokara note

ブックマークコメントでの指摘を参考に、conditional commentをIE6のみへのものに変更しました。

HTC: fix-ie-htc

fix-ie-htc

IE6の困ったところを直すHTCを書きました。

fix-ie-abbr.htc

abbr要素を使えるようにします。

fix-ie-lispace.htc

li要素が直後の空白テキストノードを取り入れてしまう問題を解決します。

注意

htc内でIEのバージョンを判定したりはしていないので、CSSトリックなどを利用して適用されるバージョンを絞り込んでください（たとえばIE6のみなら* html E {}のように）。

あと、必ず自分のサイトにアップロードしてご利用ください。

「koko-de-yomu.user.js」公開停止

Greasemonkey: koko-de-yomu.user.js - mayokara note

セキュリティの面で問題があったため、公開を停止しました。

使っている人がいましたら、使用を中止してください。

「sbmc.user.js」更新その2

Greasemonkey: sbmc.user.js - mayokara note

セキュリティ・フィックス。

innerHTMLを使っている箇所できちんとHTMLエスケープするようにした
- HTMLエスケープされた状態で送ってくるJSONがあって微妙……→対処した
z-indexを256から512に変更

HTMLエスケープとリンク生成

var h = function(str){
    return String(str).replace(/[&<>"']/g, function($0){
        return {"&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;"}[$0];
    });
};

var makeanchor = function(str){
    return str.replace(/https?:\/\/[\w\-.!~*'();\/?:@&=+$,%#]+/g, '<a href="$&" target="_blank">$&</a>');
};

後者は厳密なものではないです。

「sbmc.user.js」更新

Greasemonkey: sbmc.user.js - mayokara note

delicious.comに対応した。

あと、tr要素にユーザ名つきのclassNameを追加したので

#sbmc-user-js tr.sbmc-user-js-hatena-mayokara384 {
  display: none;
}

とかで特定のユーザを消せます。

Bookmarklet: deliciousのブックマークページに飛ぶ

javascript:void(location.href="http://delicious.com/url?url="+location.href);

delicious表示

既出かもしれない。

http://delicious.com/help/bookmarkletsに書いてあった。

コメント一覧のJSONはhttp://feeds.delicious.com/v2/json/url?count=100&url=${url}から取得できるみたいだけど書いてない。

countはhttp://delicious.com/help/feedsにあるようにデフォルト15で最大値100。

jsonをrssにすればRSS 2.0で取得できる。

JSONだとユーザ名が取れないのでRSS 2.0をみたほうが良さげ。

ginc

Google Ajax Search APIでインクリメンタル検索。

上部の検索ボックスに入力したあと500msで検索します。

IE、Opera9.2では動きません。

まあ、ただインクリメンタル検索を作ってみたかっただけ……

回文作成補助フォーム

Bookmarklet: HTMLエスケープするリンク（＋引用）生成

javascript:(function(l,t,s){var h=function(s){return s.replace(/[&<>"']/g,function(m){return ({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"})[m];});},r='<a href="'+h(l)+'">'+h(t)+'</a>'+(s?'<blockquote cite="'+h(l)+'" title="'+h(t)+'"><p>'+h(s).replace(/(\r\n|\r|\n)+/g,'<br>')+'</p></blockquote>':'');prompt(r,r);})(location.href,document.title,String(getSelection()));

makelink

<a href="${url}">${title}</a><blockquote cite="${url}" title="${title}"><p>${selection}</p></blockquote>

こんな感じのHTMLタグを作るブックマークレット（選択範囲が空ならa要素のみ）。

文字数的にもwindow.getSelection的にも多分Firefox限定。

各文字列をHTMLエスケープするところがポイント。

Copy URL+でもできるっぽいけど、なんかもうめんどくさいのでブックマークレットにした。

blockquote要素の内容モデルは

HTML 4.01 Strict: (%block;|SCRIPT)+
HTML 4.01 Transitional: (%flow;)*
HTML 5（ドラフト）: Flow content
XHTML 1.0 Strict: %Block;
XHTML 1.0 Transitional: %Flow;
XHTML 1.1: (Heading | Block | List)*
XHTML 2.0（ドラフト）: (PCDATA | Text | Heading | Structural | List)*

とかいう感じになっているらしいので、p要素つき。

deadspace

ダメな感じの日記を書くスペースを作った。

< Newer
Older >