jQueryでフォロアー一覧表示とアイコン選択!
りまいんたーで、フォロアーアイコン選択で、テキストボックスにscrean_name挿入したかったので、作ってみました。
これ使いました!!!!!
cakephpのadd画面で使用したかったので、ファイルの構造が、ややこしかった><。
◆やること
・webroot/jsにjsファイルを全部突っ込む
・webroot/cssにcssファイルを突っ込む
・webrootにphpファイルを突っ込む
・webroot/imgにimageファイルをつっこむ以上でとりあえず、下準備は完了です。
◆以下変更点
→style.css
・imageファイルのpathが変わってるので、変更してください(4つぐらいあります)
→jquery.TwitterConnections.js
・11行目
clickをreadyに変更(onloadのjQuery版)・22行目
urlを絶対パスで記入。
例)http://hogehoge/callTwitter.php?screen_name='+user+'&type='+o.type
→使いたいビューに記述
※jsファイルのパスは任意で変更してください!
<?php $this->addScript('<SCRIPT src="/cakephp2/js/twitter.js"></SCRIPT>') ?>
<?php $this->addScript('<SCRIPT src="/cakephp2/js/jquery-1.3.2.js"></SCRIPT>') ?>
<div class="column">
<a class="hidden" id="followers"></a> <div class="jf-container">
<h5><span id="title" class="username"></span>
<span id="refresh" class="refresh" title="refresh"></span></h5>
<div id="jf-grid" class="jf-grid"></div>
<div class="jf-nav">
<a id="rightbtn" class="right" style="display:none;"></a>
<a id="leftbtn" class="left" style="display:none;"></a>
</div>
</div>
</div>
<script src="<span style="color:#FF0000;">/cakephp2/js/jquery-1.3.2.js</span>" type="text/javascript"></script>
<script src="<span style="color:#FF0000;">/cakephp2/js/jquery.TwitterConnections.js</span>" type="text/javascript"></script>
<script src="<span style="color:#FF0000;">/cakephp2/js/jquery.qtip-1.0.0-rc3.min.js</span>" type="text/javascript"></script>
<script>
$("#followers").TwitterConnections({
screen_name: '<span style="color:#FF0000;">検索したいユーザの名前'</span>,
type: 'Friends'
});
</script>