2行以上の長いタイトルでも１行に収まるように文字サイズをJavaScriptで調整する
記事タイトルが長くなって折り返され、２行になってしまっている...だけど、文字サイズを小さくしてでも１行にきっちり収めたい...！！
カテゴリー 67件
技術メモ
-
-
Hexoのカテゴリーリストにcurrentクラスを付けて現在地をハイライト表示する
HexoではHelperという機能が備わっており、よく使う機能は簡単に出力できるようになっています。その機能を利用すると下のように記述することで、簡単にカテゴリー一覧を出力できます。
-
開いているページの構造化マークアップを簡単にチェックするブックマークレット
Googleが提供しているツールに、構造化データ テストツールというのがあり、URLを入力するだけでサイトの構造化マークアップを簡単にチェックすることができます。
-
Hexoで画像にloading="lazy"を自動で追加して画像を遅延読み込みする
Chromeでいよいよ画像の遅延読み込みがネイティブでサポートされました。
-
クリックで画像を拡大するプラグイン(Lightbox)をjQueryなしで自作してみる
Lightboxという単語は死語感が漂っており、今どき需要もなさそうですが...。
-
30分で完了！お名前.comのドメインをGoogle Domainsへ移管する
このブログのドメインはお名前.comで取得していたのですが、先日ドメインを更新しようとしたら、netドメインが1,480円（1年）へ値上がりしていました。
-
Hexoで記事ごとに適用するCSSやJSファイルをFront-matterから自動で読み込む
Hexoでブログを書いていると、記事ごとにCSSやJavaScriptを書いて読み込みたいと思うことがよくあります。
-
Netlifyは大文字URLが使えない件とHexoを運用する上で確認すべき設定
このブログはNetlifyという静的サイトホスティングサービスを使って運用しているのですが、サイドバーに設置しているカテゴリー一覧の英字を含んだカテゴリーをクリックしたとき、毎回301リダイレクトが挟まることに気づきました。
-
contenteditable属性で入力したCSSがページにリアルタイムで反映されるフォームをつくる
HTML5で追加された属性にcontenteditableというものがあります。これを付けることで、あらゆる要素のテキストノードの編集が可能になります。ブラウザ版Twitterのツイート入力フォームもこの属性が使われています。
-
CSSだけで文章を折りたたむ（続きを読む）その1
今回はHTMLとCSSのみでコンテンツの開閉、いわゆる「続きを読む」を再現してみます。