I LOVE YOU, 唇噛んだ

【9/18追記】
Chromeから見たら下記の通りの挙動なんですけど、iOSからSafariで見たら相変わらず画面の中で迷子になりましたわ😂

自分用備忘録&同様の悩みをお持ちの方がいらしたら、と思って残しておきます。

ダラッダラ喋るのが好きな私のブログは、［続きを読む］機能を使用して長文をよく書いております。
ですが、［畳む］を押して隠していた要素を畳むと、中身の文章の長さの分だけテキストが引っ張られてしまい、ページの中で迷子になってしまいがちです。
なので、どれだけ隠されていた文章を読んでスクロールしても、［畳む］をクリックしたら［続きを読む］の位置に戻ってくれたら嬉しいなぁ～と思って色々調べたんですよ。

input要素で［続きを読む］機能が実装されていたら、CSSでどうにか出来る方法もあるなぁ、と言う感じだったんですが、てがろぐの［続きを読む］機能は、デザインを弄りやすいaタグとJavaScriptで実装されているのでどうにもならないな～と諦めていたんですよね。
(作者様に要望は出させて頂きましたが「何か考えて試してみますので、気長にお待ち下さい」とのことで、気長に待っております。笑)

ですが、1個前の記事を書いた時に「あれ…?［畳む］をクリックしたら［続きを読む］の位置に戻ってきたぞ…?!」とビックリしたんです。
仕様が変わったのか…?いやでもアップデートしてないし、他の記事はやっぱり戻らない…!!

と言う事で気付きました。

隠した要素の後に文字があれば［続きを読む］の位置に戻ってくるという事に…!!!

このブログで［続きを読む］機能を使用する時は、記事の1番最後に来ることがほとんどで、その後に文字が続く事がなかったんですよね。だから全く気付きませんでした。

と言う訳で、隠す要素[H:●●●]を記述した行の最後の]の後、改行をして[C:transparent:.]を挿入しました。
何かしら文字があれば良いのだろう、と思ったので『.（半角ピリオド）』を透明色で入れてみたのです。
すると無事に［続きを読む］の位置に戻ってきました!

非常に簡単な話ですが、機能が変わるまではこの方法を使用していこうと思います。
『[C:transparent:.]』を読み方『＊』で単語登録もしたので、すぐ出せます。笑
もし同じように改善策を模索していたけど盲点だった!と言う方いらっしゃいましたらどうぞ～。