読者です 読者をやめる 読者になる 読者になる

生涯未熟

プログラミングをちょこちょこと。

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

sencha iphone HTML

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




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


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

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


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


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


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

<body>

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

 </body>


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


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


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



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


このエントリーを含むはてなブックマーク