文字を一文字ずつフェードインさせる処理(JavaScript)
文字を一文字ずつフェードインさせる処理です 一応自作ですので不具合等あるかも知れません。参考サイトも見つけましたのでそちらの方がよいかも知れません。 JavaScriptを使って表現しております。またテキストが見え始めた […]
投稿者: mitumine
アフィンガー6でトップページ以外でサイドバーに表示されてしまう「新着記事一覧」を非表示にしたい
アフィンガー6でトップページ以外でサイドバーに表示されてしまう「新着記事一覧」を非表示にしたいと思った ウェジェットで消してるのになぜか表示されるので調べたら別の所で表示設定があったので忘れないように記載しておく AFF […]
「続きを読む」を押すと下にサッと文字が出てくる処理(JavaScript)
「続きを読む」を押すと下にサッと文字が出てくる処理の実装です。 JavaScriptを使って実装させております。 文章はChatGPTに頼んだ… JavaScriptの[offset_height]は「details-b […]
画像にリボンをつけよう
画像の左端にリボンを付けておしゃかわにしましょう Cat 参考サイト：https://adatype.co.jp/info/archives/staff_blog/24
画像サイズがバラバラだがすべて均一に綺麗に表示させたい場合
例えば商品一覧など横並びに4つ並べて表示させたい場合 しかし用意された画像が全部バラバラで統一してくれない そんな場合の処理になります。 imgタグのクラスに「img-fit」を追加して対応しております。 object- […]
Animate It!を使って動的なアニメーション再生をしよう
ある程度コンテンツが見えたら、フェードインして表示させたい。 しかしそれだとCSSだけで実装できないし、JavaScriptはわからない。 そんな場合「Animate It!」と言うワードプレスプラグインがおすすめです。 […]
スマホ・タブレットにて横向きにしてサイトを見られたくない場合の処理
サイト作成していると横向きで見られたくない(対応が面倒)な時があります。 横向きになった場合に、ウィンドウを出して「横向き対応してません」と表示して見せないようにします。 本ページでは実際に横向きにした場合に、警告画面が […]
変数でフォントサイズ等の情報を一括管理するCSS変数（カスタムプロパティ）
CSSにてフォントサイズを修正する時に一括で変えたい時があると思います。 CSS変数（カスタムプロパティ）というのがあるのでそれを使います 参考サイト：https://qiita.com/taqumo/items/b22 […]
absoluteで上下左右中央表示する
absoluteで上下中央表示する。 いつも調べてコピペしてるのでこちらでも記録しておくことにする 参考サイト：https://qiita.com/ushi_osushi/items/d9f0c8990b2e807969 […]
PCだけスマホだけ表示させたい場合
PCだけスマホだけ表示させたい場合があります。 iPad min未満をスマホ表示として表示させたいという感じで処理を書いてます 参考サイト：https://csshtml.work/sp-display-none/
アフィンガー6のヘッダーコンテンツに動画を入れたい場合
アフィンガー6のヘッダーコンテンツに動画を入れたい場合の覚え書き。 どうやらEX版では簡単に実装できるようですが、EX版は持ってないのでPHPとCSSをいじることで実装します。 PCとスマホ対応のみしてます。
[LeaderLine]JavaScriptで要素間を線でつなげるライブラリ
要素間を線でつなげるライブラリになります。 お仕事で使うことがあったので忘れないように記載 参考サイト：https://anseki.github.io/leader-line/
画像を横に無限ループさせる方法(JavaScript)
画像を横に無限ループさせる処理をJavaScriptで実装します。 自作なので色々と不具合等あると思います。 [animation]を使わないのはなぜかと言うと、画像が表示されない（存在はしてる）状態があったからになりま […]
横幅と連動して文字のサイズを変更するようにしよう
横幅と連動して文字のサイズを変更するように調整します。 条件として各フォントサイズの指定は「REM」で指定することが必須になります。 また、文字が大きくなりすぎないように、小さくなりすぎないように、「clamp」を使うこ […]
自作でホップアップ処理を作る
[st-minihukidashi webicon=”” fontsize=”80″ fontweight=”” bgcolor=”#F […]
【WordPress】自動で挿入される＜p＞タグや＜br＞タグを無効化する方法
仕事をしていると謎の改行やpタグが入りデザインが崩れることがよくあります。 今まではCSSで誤魔化してましたがいい加減邪魔になってきたので無効化することにしております。 ただ[br]も無効化されるのがまた煩わしいという問 […]
[FileBird Lite]を使ってメディアファイルをフォルダ分けしよう
[FileBird Lite]プラグインを使ってメディアファイルをフォルダ分けします。 メディアファイルの数が多くなると管理が大変になりますが、フォルダ分けをすることで管理が楽になります。 参考サイト：https://s […]
[SyntaxHighlighter Evolved]でコードを簡単に表示させる
[SyntaxHighlighter Evolved]プラグインを使って簡単にコードをホームぺージ上に表示することが可能です。 通常[pre]を使って表示させると思いますが、うまくいった試しがないし空白コードや改行コード […]
[canvas]要素の上にHTML記載で文字や画像を載せる方法
[canvas]要素の上にHTML記載で画像や文字を入れたい場合の処理です。[position: absolute;]で可能です。 今回は「パーリンノイズ」というものを[canvas]に表示させ、その上に画像と文字を2カ […]
サイトを見るときにツールバーの表示を消す(ワードプレス)
ダッシュボード、左にある「ユーザー」→「プロフィール」から「サイトを見るときにツールバーを表示する」のチェックを外す これなぜかいつも思い出せないので記載することにしました。 参考サイト：https://wordpres […]