【仕事用メモ】
iPhoneやiPadはiframeに対応していないので伸びてしまう。
どうしても仕様上iframeを使わないといけない場合は、head内に下記のコードを埋め込めばヌルヌルスクロールが出来る。
iframe要素を<div></div>で括るのを忘れずに！

【サンプルコード】
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.js"></script>
<script type="text/javascript">
$(function(){
if (/iPhone|iPod|iPad/.test(navigator.userAgent))
$('iframe').wrap(function(){
var $this = $(this);
return $('<div />').css({
width: $this.attr('width'),
height: $this.attr('height'),
overflow: 'scroll',
'-webkit-overflow-scrolling': 'touch'
});
});
})
</script>

ブログのサイドバーとかにTwitterウィジェットを設置していると思いますが、今月5日あたりに使えなくなります。

こういうやつね。

詳細はコチラ

lithium*は新しいウィジェットに変更してあるのですが、
今までのカスタマイズ可能なインターフェイスから、カスタムしづらい仕様に変更されます。
新しいウィジェットは困った事に、そんなに自由度がありません。

設置して分かったのですが、一番困るのは「横幅が220px以下には出来ない」と言う事ではないでしょうか？色も2種類しか選べませんね・・・。

と言う事で、今回は無理矢理横幅を変える方法を考えました。
やり方は簡単です。cssファイルに、

.twitter-timeline {
min-width:185px !important;
}

を加えるのみ！
上記のコードはmin-width:185pxですが、任意の数字を入れて下さい。

webのお仕事をされている方はお忘れなく変更を！！

次回は色を変える実験をしますね！

自分メモ

jQuery MobileベースでHPを制作する時、PHPなどの動的サイト作成時は煩雑になりがちなのです。
余計なハッシュタグ(#)で正しくページ遷移しないため、下記のコードを加えるとAJAXを無効にする事が出来る。

<script language="JavaScript">
// ajax の無効化
$.mobile.ajaxEnabled = false;
</script>
また、部分的に無効化したい場合は、
<a href="index.html" data-ajax="false">リンク先</a>
の様に、「data-ajax="false"」を加えるとAJAXを無効化でき、余計なハッシュタグが表示されないのでアール。
まだまだjQuery Mobileはバグが多いらしいので、使用を控えた方が無難かもしれない。