メニューページの表示が、AndroidのChromeでおかしくなっていたのを修正した話
昨日更新したメニュー用イラストを組み入れてから、どうも右辺に謎のスペースができてしまうように。
このホームページは幅を800ピクセルに収めると同時に、モバイル用にviewportを定義することで、そのサイズがぴったりおさまるように調整していたのですが、どうも、どこかではみ出してしまっているかのような挙動。
結論から言えば、メニュー表示をcssのleftプロパティで右にずらしたことが原因でした。それで、横幅がはみ出たと判断されて自動的に縮小されていたんですね……。
最初はメニューレイアウト部分の幅をwidthプロパティではみださないように調整する方向で考えていたのですが、これだと、レイアウトをずらすたびに幅も調整が入ることになって面倒。出来れば最終手段でなければ取りたくない選択肢です。
いろいろ試した末に、親のdivタグのcssプロパティとして、overflow:hiddenを設定する方向で調整しました。このタグで作られるエリアは、実質幅が固定されているので、はみだせないことを明文化してみた感じです。ただ、これは、このタグにはheightが指定されていないからできた方法で、heightも固定してしまっているところに使うと、おそらく下のほうが見えなくなったりするようになるのではないかと思います。今回は状況が合致してうまくいきましたが、これが最適解になるかは、その目的によって変わりそうです。
工夫で対応できるのは楽しいですが、鉄板と言い切れる手順がないというのもなかなか難しいですね。
メニュー用イラストを追加しました
前々から、用意しようと思ってなかなか準備できなかったメニュー用イラストがやっとできたので、更新しました。こんな感じになりました。
Git コマンドメモ更新しました。
追加したい情報が出たので更新です。
だんだんとコマンド数も増えてきて、最初ページを分けることも少し考えたのですが、それはそれで、メモとしての便利さが薄れるように思えたので、冒頭に項目リストを並べてみました。こんな感じです。
項目リストは、jQueryを利用した自動生成です。ページから情報を洗い出して、リストとリンクを作っています。
久しぶりに使うと、やっぱり jQuery は楽しいし、色々楽できますね。まあ、本当は jQuery を色々使ってみる、というのがコンセプトだったのに、今まで使っていなかったのは、どうなんだろう、という感じですがね（苦笑）。
サイト入口のレイアウトを変更しました。
入口の背景に絵を貼ってみました。前の形もシンプルで悪くはなかったのですが、やはり絵が一枚入ると、それらしい感じがでますね。
メモ書きトップのレイアウトを少し整えました
あまりにもメモ書きページのトップが適当すぎたので、少しだけ体裁を整えました。
Unity 5.4 + Moto G4 plus でパフォーマンスが出ない
見事にはまったのでメモしておきます。早く直って欲しいですが、どちらかというと Moto G4 側の問題なんでしょうか……？
Moto G4 Plus bad performance with OpenGL ES 3.1
テクスチャ1枚表示しただけでいきなり60fpsを割り込んだので正直最初焦ったのですが、Platform Settings で Auto Graphics APIをオフにして、直接 OpenGL 2.0 を指定するようにしたら、何事もなかったかのように普通に60fpsが出るように。
Krita 3
先日家のPCにインストールしてあるKritaをバージョン3に更新したのですが、アニメーション作成のサポートが追加されていたのですね。これはもっとちゃんと調べて使ってみなければ……。
git コマンドメモ
git は、家でもバージョン管理の主力ツールなのですが、コマンドや設定の仕方を忘れて、毎回調べる羽目に陥ることがあるので、メモ書きで残すことにしました。
今回、よく使っていてちゃんと覚えているコマンドは記載していないので、リストとしてはかなりアンバランスです。ただ、しばらく使っていないと忘れることも出てくると思うので、そのうち良く使うコマンドも埋めていったほうが良いのでしょうね……。
何度目かの Jaichi Forest 開始
しばらく放置していたこのページ。今回、jQuery3.0がリリースされたことを知ったのをきっかけに再び始動してみることにしました。
前まではjQueryも1.x系を使って、古いブラウザでも動くように……、みたいなことを考えていたのですが、そこは今回すっぱりとあきらめ。
ここしばらくは、ちょっと作ってはすぐに更新が止まり……を繰り返しているので、そこはもう少しなんとかしたいところです。