コンパイラかく語りき

import { Fun } from 'programming'

個人サイト作成④ チャット風ボックスの実装と、テキストコンテンツの挿入

chuckです。

引き続き、個人サイトを作成していきます。

 

 

前回までで、基本的な動作は実装できました。

今後微調整はあるかと思いますが、とりあえずスクリプトはいったん休止です。

chuckwebtips.hatenablog.com

 

今日はHTML側をいじって、肝心のコンテンツをセットしたいと思います。

(たぶんプログラミングにあまり関係ない)

 

ここまで作った

f:id:chuck0523:20151012211703p:plain

http://chuck0523.github.io/front-end-coding/rotateWindow/rotateWindow5.html

 

こんな感じで、テキストメッセージ風のコンテンツにしました。

めっちゃ恥ずかしいんですが、Q&A風で会話が進みます。これを一人で黙々と作っていたことが恥ずかしい。

 

 

ただ、いくつか修正が必要な点があり、個人サイトとしての公開はまだ先になりそうです。

以下、修正ポイント。

回転イベントの混乱

回転イベントで時々エラーが起こります。

というか、現状では1ページ以上スワイプできてしまいます。1度にスワイプできるのは1ページずつにしたいのですが、なぜか複数ページが一気にめくれます。

その際に数値が狂ったのか、おかしな挙動を見せます。

これをまず直さなくては。

 

スマホ対応

幅・高さ・文字サイズにおいて、今回はvw, vhという単位をフル活用しました。

なので自動的にレスポンシブになるのですが、スマホサイズだとちょっと小さくなりすぎかも…。ある一定以下になったら固定サイズにした方がいいかもしれません。

その修正も次回。

 

コンテンツの内容

僕個人について、つらつら書いてあるわけです。

大公開する前に、もう少し寝かせて文面を推敲します。

 

 

というわけで、個人サイト作成の進捗は85%といった感じです。

 

GitHub

github.com