空の回廊 - 時々web・創作系 -

独りよがりなWebLog(たまにTemporary)

スマホでcssが反映されない原因

まさか2日連続で記事を書くことになろうとは…
(今回は私が自分が書いたコードを忘れてたのが原因ですけど)

HPを更新して、スマホタブレットの方で背景画像が新しいものに反映されない…
ああ そうそう、といつものように xxx.css?の後を修正したものの、反映されない…

参考:
euren07.hatenablog.jp

www.merges.co.jp

しばらく色々格闘後、該当コードの下の方に目をやると… これかぁー! と問題を発見。
いや、問題でも何でもない…

メディアクエリを入れてただけだった。 そっちの背景画像が正しく参照されてただけだった!
アニメーションとかのコードを入れてたせいでコードが伸びてすぐに気づけなかった。
自分で書いたコードなのに時間が経って構造を忘れてしまいました。。

スマホ css 反映されない キャッシュ chrome などなど
色々検索してしまいました。
どうって事ない原因だったけど、同じような方がいて、ここに辿りついてハッとなってもらえたら幸いです。

Firefoxだけページ内アンカーリンクの位置がズレる

ただ、文字を入れ替えただけのハズなのに、ちゃんと動かなくなる事ってありますよね。
きっとそれは妖怪のせいかもしれません…

なんて…一応治りました。

単に
a href="○○○.html#abc01" を a href="#abc01" にしました。

ただ、ページ内やトップページならこれで良いけど、そうでないとやっぱりズレちゃう…
どうもjQuery(横並びスクロール)ぽい。。
(横並びの高さで計算されてないとかそんな感じ・・?)

その辺りが分かって来た折、こんなサイトを見つけました。
(ありがとうございます…!)
design-ya.net

//</head>の直前に
function now() {
window.location.reload(true);
}


今回の自分のケースではそこまでするべきなのかちょっと悩みますが
どうにも出来ないケースなら
たった数行のコードで何とかなるなら良いのかな?
(原因のjQueryのその辺りの部分を直したら(直せたら)スムーズにいくのかな)


にしても何故firefoxだけなのか。。
ローカルでは問題なく、要素を調査してる状態(した後)では正しい挙動になってると言う
いやーなやーつ。。 しかも何故今なのか…。(見落としてたはずはない…んだけど…)
それでもfirefoxは大事なブラウザです…!

ガイドページをリニューアル

この度オリジナルシナリオのガイドページをリニューアルしました。

反応等が中々ない状況で(コーディング的な)クオリティをUPするのは大変なので、このレベルに…
でも、1年前に比べたら十分です。
絵的な素材のクオリティが低いのが残念。(しかたなし)
でもトップに飾る絵は、お金掛かっちゃうけどまた絵師さんに綺麗な絵を描いて貰いたいな…

20180727131844
(※ 画像は制作中の物です。 実際はちょこっと修正しました)


スマホタブレットでは…一応、見れるという状態です。
viewportの設定が難しい…
(こちらは気が向いたら勉強のためにって言う感じかな。 メディアクエリは好きなんですけど…)

漫画で最後まで描き切る事を諦め、あらすじだけ書ききったり、
伝えたい事を伝える、最後まで書くにはどうしたら良いか色々試行して、
取りあえず持っているwebの知識を使って、こういう形での展開もいいかな?って想いに至り、辿りつきました。


この作品への想いは小さくはないけれど、これからの自分の成長を考えると今のままでは作品への執着から成長の障害・機会損失になってしまうので、ここでまた一区切り……(にしたい。理性的には)

こうしてそれなりにサイト(箱)をある程度しっかり作って、情報を分類・整理して
そこにアウトプットして荷物を片付ける感じ。
新しいその作品のネタも溜め込まずにそこへ保存して…!

設定を見て、想像してくれる人が現れてくれたらいいなぁと…


そうして削減出来た時間を使って、新しい自分を構成するものを見つけていきたいなと思います。

意識的にこうやって区切らないといつまでもそこに囚われちゃうからね。


色々大変な事だらけだけど
良いサイクルを生み出せば色んなモチベーションも上がるかな?
(人の辛さは絶対値であって相対的なものではないので 僕/私の方が大変、大変だったと言うツッコミはここでは無しでお願いします…!)