Seesaa機能強化について雑感SBMのボタンの見せ方
Design
SBM counter と SBM clipper を自作して設置してみました。エントリの下のほうにボタンがあります。
SBM counter のほうは，各ブックマークサービスが提供しているブックマーク数を画像で取得するAPIを使っています。
このエントリが非常に役に立ちました。yagerさん，ありがとうございます。
Javascript で SBM counter と SBM clipper の各要素を書き出しています。表示させたい箇所に，次の記述を挿入すればよいようにしました。
<script type="text/javascript">setCounter(url)</script>
<script type="text/javascript">setClipper(url, title)</script>url，title の部分には，ブログで使われている変数を入れます。
del.icio.us でのブックマーク数を取得するとき，URLをhash変換しなければなりません。高度な JavaScript 技集 にある「md5.js」を使わせてもらいました。
各サービスの画像のサイズ，色合いがまちまちなのが気になったので，height: 12px;で統一し，不透明度を下げてトーンを若干落としてあります。
IE6を除くモダンブラウザでは最初各ボタンが非表示になっていて，マウスがのると現れるようになっています。
これらは，CSSで対応しました。
以前，こんなエントリも書きました。最近，hataysan と Marumamekoさんにブックマークしていただいて思い出し，課題にしていたところを解決しようと思ったわけです。
考え方は基本的に変わっていません。（リンクを別ウインドウで開くこと以外は）
これで俺の思い描く理想の形に近づきました。
追記 2008-06-10
はてブで「使いづらい」というご意見をいただきました。CSSを修正して，マウスが反応する範囲をちょっと広げ，外れてもすぐ復帰できるようにしました。
「気づきにくい」というご意見もいただきましたが，「目立たせない」のが仕様です！
Design
2008-06-08
0
0
Add Comment