11.Googleカレンダーをレスポンシブにするには?

HTMLタグによるカレンダー表示をプラグイン #iframe によるカレンダー表示に変更する。

旧QHMでの Googleカレンダー表示の例

  • 【注意】上記のカレンダーはスマフォ未対応です。


新haikでの Googleカレンダー表示の例

  • 【注意】上記のカレンダーはスマフォ対応済です。


新旧を比較する

旧QHMでの Googleカレンダー

#html{{
<iframe src="https://www.google.com/calendar/embed?height=600&amp;wkst=1&amp;bgcolor=%23ccffff&amp;src=mo.ri.sa.ki.hi.to.shi%40gmail.com&amp;color=%23875509&amp;ctz=Asia%2FTokyo" style=" border:solid 1px #777 " width="700" height="500" frameborder="0" scrolling="no"></iframe>
}}

新haikでの Googleカレンダー

#iframe("https://calendar.google.com/calendar/embed?src=mo.ri.sa.ki.hi.to.shi%40gmail.com&ctz=Asia/Tokyo",500,100%)