ktyr report

[javascript]jQueryPlugin:tinyTips

2011-01-07

これは便利ですね。ちょっと使おうと思ったので調べました。
ロールオーバーすると吹き出しを出してくれるjQueryPlugin。
tinyTipsサンプル

使用方法

1)
Mike Merritt – jQuery Plugin: TinyTips 1.1からjsをダウンロードする。

2)
jsファイルを読み込む。

<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.tinyTips.js"></script>

3)
htmlのbodyにはこのようなコードを書く。

<a title="見つけにくいものですか？" href="#">探し物はなんですか？</a>
<a title="http://www.yahoo.co.jp/" href="http://www.yahoo.co.jp/">Yahoo!JAPAN</a>
<a title="白い結晶が浮遊・沈殿することがありますが、これは天然のミネラル成分が結晶したものですので、品質に問題はありません。" href="http://www.google.co.jp/">Google</a>

4)
次のjsを記述する。

$(document).ready(init);
function init(){
 $('a.tTip1').tinyTips('light', 'title');
 $('a.tTip2').tinyTips('light', '<img src="image/sc01.jpg" border="0" alt="" />http://www.yahoo.co.jp/');
 $('a.tTip3').tinyTips('light', '<img src="image/sc02.jpg" border="0" alt="" />http://www.google.co.jp/');
}

参考にしたサイト

Mike Merritt – jQuery Plugin: TinyTips 1.1
http://www.mikemerritt.me/blog/jquery-plugin-tinytips-1-1/

[Facebook]shareボタン

2011-01-05

新年明けましておめでとうございます。
2011年一発目は小ネタです。
Facebookのshareボタンを押したときに表示される
サイトの情報を指定する方法とサンプル。
参考にしたサイトに全部書いてあります。

1)htmlタグの属性を追加する

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">

2)metaタグを追加する

<meta property="og:title" content="FacebookShareテスト frasio report タイトルタグ" />
<meta property="og:type" content="article" />
<meta property="og:url" content="/facebook/02/" />
<meta property="og:image" content="/facebook/02/image/facebookshare.jpg" />
<meta property="og:description" content="白い結晶が浮遊・沈殿することがありますが、
これは天然のミネラル成分が結晶したものですので、品質に問題はありません。" />

3)サムネイル画像を用意する

サンプル

参考にしたサイト

Open Graph protocol – Facebook開発者
http://developers.facebook.com/docs/opengraph

[facebook]newsfeed reader

2010-12-02

とりあえず小手調べです。
認証通してnewsfeedを表示するまでです。
Facebookは機能が多くてアプリを作るのに
かなり時間がかかりそうです。

newsfeed reader

参考にしたサイト

Facebook開発者　参考資料
http://developers.facebook.com/docs/

コーヒーサーバは香炉である – [Facebook]Facebook アプリ作ろうぜ (その1 準備編)
http://www.madin.jp/diary/?date=20101016

「そん」の気ままなLOG – facebookで携帯認証確認する方法-2
http://sonkunt.blog26.fc2.com/blog-entry-473.html

[Google Analytics]EventTracking And Data Export API

2010-12-01

また地味なAJAXでGoogle Analytics
Google Analyticsでログを取って、Data Export APIでログを取得するテストです。
ページビューなどはログとして反映されるまでに24時間かかるようですが
「ボタンを押した」などのイベントは10～30分で反映されるようです。
よって即時反映させる必要が無い、予算も無いというときに使えるかもしれません。
PHPはこちらのサイトのクラスを使っています。
Google Analytics API class for PHP
http://www.askaboutphp.com/63/google-analytics-api-class-for-php.html

Google Analytics EventTracking And Data Export API

参考にしたサイト
Google Analytics トラッキングコード
http://code.google.com/intl/ja/apis/analytics/docs/tracking/home.html

Data Export API
http://code.google.com/intl/ja/apis/analytics/docs/gdata/home.html

Google Analytics API class for PHP
http://www.askaboutphp.com/63/google-analytics-api-class-for-php.html

[twitter]指定のURLが含まれているツイートの数を調べる

2010-11-12

また地味なネタです。
公式Tweetボタンで使われているっぽいです。

指定のURLが含まれているツイートの数を調べる。

使い方

var head=document.getElementsByTagName('head')[0];
var script=document.createElement('script');
script.src=get_jsp('http://www.yahoo.co.jp/', 'when_get_result');
head.appendChild(script);

function get_jsp(url, callback){
	var str='';
	str+='http://urls.api.twitter.com/1/urls/count.json';
	str+='?url='+encodeURIComponent(url);
	str+='&callback='+callback;
	return str;
}
function when_get_result(data){
	alert(data.url+" "+data.count);
}

気付いたこと、確認したこと。
・TwitterAPIの仕様書には載っていないようです。
・つぶやいてから反映されるまで5秒～30秒ほどかかるようです。
・つぶやきを削除してもカウント数は減らないようです。
・使い所はよくわからない。