今までの仕事や趣味等の経験から、ワードプレス、HTML、CSS、JS等のWEB系の技術やプラグインなどで共有したいことや、忘備録的な内容も含め、ふざけながら更新していきます。
CSS メインビジュアルや画像をCSSでアニメーションを付ける8パターン
メインビジュアルや、記事のメイン画像、タイトルに使えそうな動き・アニメーションを、CSSでいくつか作成してみました。シュワッ、シュッ。みたいな。
WEB Tips WEBページをダークモードに対応させ、切り替えスイッチを設置する
今さらではありますが、対応しました。ダークモードに。
CSS アクセシビリティを無視してtableのスマホ表示対応
tableのスマホ表示は「ScrollHint」が総合的に良きと思っているのですが、時と場合によっては導入が手間だったり、システムの関係で使えないという事もあると思います。そんな時に、やむをえず対応したtableのスマホ表示の忘備録と注意喚...
CSS safariとかで画像が縦に伸びる現象が起きたらflexboxを見直すんだ
コーディングには必要不可欠なぐらい多様しまくってるflexbox。昔のようにfloatをいっぱい使っていた頃には、もう戻れないよ。そんなflexbox、safariブラウザで確認すると画像が伸びる場合があります。
CSS テーブルを並べ替えソートする便利なライブラリ「tablesorter」のカスタマイズ
テーブルの一覧をクリックで並び替えソートしてくれる「tablesorter」。簡単設置で、本当に便利な便利なライブラリの簡単なカスタマイズ方法。
CSS inputタグのcheckboxとradioボタンでできる事まとめ
フォームの中の選択項目として利用するinputタグのcheckboxとradioボタン。どちらも選択肢を選ぶ目的で古(いにしえ)から伝わる方法です。そんなcheckboxとradioボタンを使い、JavaScriptなどは使わずにできるカス...
CSS アクセシビリティを考えてinputタグのcheckboxをボタン化する
inputタグのcheckboxを使いやすくする為にCSSで装飾する事、あると思います。押しやすくしたり、視認性を高めたり、操作性を向上させる事は良い事ですが、引き換えにアクセシビリティが損なわれる事もあります。この記事ではそのアクセシビリ...
JavaScript 「トップへ戻るボタン」にページのスクロール量を可視化カスタマイズ
もはやデフォルトの存在の「トップへ戻る」ボタン。凝ったデザインや素材を使うのは「面倒だなぁ」と思い、ずっと後回しにしておりました。そんな時、良い「トップへ戻る」ボタンを見つけました。
CSS 【ワードプレステーマ】CocoonでSANGOみたいな切り替えタブを実装する
トップページを固定ページに変更してから数週間経って、ずーっと「これでいっか」感があり、前からいいなぁと思っていたSANGOの切り替えタブを実装。その実装したトップページのテンプレートファイルを紹介。
WEB Tips 【カスタマイズ】ワードプレステーマ「Cocoon」に変えてからの当サイトのデザイン変更点
ワードプレスのテーマをCocoonに変更してから、もうすぐ10カ月ぐらい経ったかなと。今振り返ってみれば、全部自分の自己満なんですが、いろいろ変更やカスタマイズしてきたなと思いまして、このへんで何を変更したか、まとめようと思いました。