モバイルウェブデザイン術 #2 〜SenchaTouch〜

今回もSenchaをいじり倒します。

前回のタブは確かに便利なんですけど、「htmlの部分いじれんと使い物にならないやんけボケ！」との声が聞こえてきそうなので、その部分のイジリ方をば。

前回のソースのitems部分にご注目。

items: [{
	title: 'その１',
    	html: '中身1',
    	cls: 'card1'
}]]

ここのhtml部分をcontentElに変えちゃいます。

items: [{
	title: 'その１',
    	contentEl: 't1',
    	cls: 'card1'
}]]

contentElによってhtmlファイルのbodyタグにその対応するエレメントを付けてやるとそのhtmlが表示されます。
やってみるとこんな感じになります。

<body>

<div id="t1">
test
</div>

 </body>

ね？簡単でしょ？
これでtab1にはtestと表示されるはずです、チェックしてみましょう。

お、ちゃんと反映されてますねー。
testだけでは味気ないので色々とタグを試してみましょうか。

うーむ、h1タグやらは反映されないんすなぁ。
tableタグはなかなか良い感じです。

今回はここまで。
次回もSenchaいじる・・・かも。

生涯未熟