経過報告、というよりメモ。

昨日一昨日と雨が凄かったです。

今日はほぼ通常通りでしたが、止まることがまずない阪急電車が止まって驚いた。

先日の地震といい今回の豪雨といい、近年の”自然の猛威”はちょっと異常ですね。

警報が3日も出続けているというのは初めてで、近所の用水路の増水具合がえぐくて引きました。怖いわ。

警戒地域にお住まいの皆さま、どうぞお気をつけくださいませ。


*********************************************


そしてサイト改変の経過報告といいますか。

こんな感じになりそう、という中間報告です。はあ。

というか、自分がどこのサイトを参考にしたかのメモですね、はい。


*****


20180707 


iPadを横向きにした場合の画面。

PC表示でも一定の横幅があればこうなります。


*****


20180707_2 


こちらはiPad縦向きにした時の表示画面。

スマホで見た時、PCで幅狭く表示した時はこんな感じ。

横に一杯に広がります。

左に表示されていたメニューは右上の3本線(ハンバーガー)で展開します。


しかし色彩センスがなくて悲しい。



************************************


★サイト基本形の参照元はこちら:

 http://www.webopixel.net/javascript/1289.html


レスポンシブのハンバーガーメニュー。サイドバーは固定

メニューの3本線にmenuと文字を入れたいのだけれど、入れられたのだけれど、できたー!と思いきやmenuがそのまま回って表示されててワロタ。

そして閉じる時にcloseと表示するにはどこにどうCSSを入れたらいいのか分からない。笑



★全ページ共通のサイドバーとヘッダーはjQueryのloadで呼び出し

 https://code-life.hatenablog.com/entry/2015/10/27/222803

 https://www.sejuku.net/blog/42555

 

※jQuery3ではloadの単体使用は廃止なので、バージョンには気をつけること

※fc2ホームページだと読み込まれる側のhtmlの拡張子がhtmlだとAjaxが動かない(重要)

  http://nizi-ringo.sblo.jp/article/55937182.html

   ※アップロードする時は拡張子に気をつけること!

※CSSは読み込まれる側のページに反映されるようにすること



★更新案内 flexbox 便利。

 flexbox : https://web-bruno.com/flexbox-css3/

 object-fit:https://www.webcreatorbox.com/tech/object-fit

 文字重ねる:https://www.e-sanwa.co.jp/sbs/column/20171215/


近年よく見るようになったカード型デザイン。シンプルなのを選んだ。

…これカード型デザインだよね…?
今のでもそれを目指そうと思って失敗しているんだけど(爆笑)、今度のはうまく行きそう。


画像をトリミングした上で固定表示したいなあと思って、あれこれとCSSを探すとたった1行でそういうことが出来ると判明。おお…!

と思いきやIE11が対応してない。チッ。jQueryで回避。


写真に文字を重ねたいなーとあれこれ調べる。

まあこれ今でも使ってるんだが、一回導入して軌道に乗ったらナチュラルに忘れるんですよ。ははは。

実装したら中々いい感じじゃないか明智君!(誰や

と思ったのも束の間、展開したサイドメニューが更新案内の下に隠れてしまった。笑える。

あーあーあー…どーするよこれ…


色々見ているとz-indexの問題で、あっちとこっちのposition指定に問題があるのかと、これかなー、あれかなーと触ってみるも解決せず。

よくよくCSSを見てみると、z-indexを指定する階層が違っていた。

兄弟要素じゃないと効かないって。親子要素にかけてたわー。


以前にトライした時は全く分からなかったのに、今やって見ると案外あっさり出来たりするものもあって、我ながら不思議ではある。

しかしながらそんなものは殆どなくて、分からない事は大抵1日~2日かかって調べる羽目になるので本当に悲壮感漂う。笑

ただ素人なりに頑張ってやってるとは思うのですよ。

はい…

関連記事

2 Comments

There are no comments yet.

ジゴロウ  

No title

地震きたり、暑かったり、大雨だったり、嫌になりますね。
こっちも、つい先ほど地震あったり、熱中症が原因で入院した親類がいたり、5678月が嫌いになりそです。
お互いに気をつけましょう。
くれぐれも無理なさらず。

2018/07/07 (Sat) 23:24 | EDIT | REPLY |   

ヒジハラ  

>ジゴロウさん

近年は寒暖差の激しさから始まってむちゃくちゃな自然現象に振り回され、確かにこれは嫌になりますorz
そして梅雨の時期の疲れやすさに加えて、私はこの2・3日で完全に生活のペースが狂いました。笑。本当に疲れる時期ですねえ…
ジゴロウさんも御自愛下さいませ~

2018/07/08 (Sun) 21:52 | EDIT | REPLY |   

Leave a comment