【CSS】流れる文字のCSSアニメーションサンプル
文字を流れる様にする方法は昔から<marquee>というHTMLタグが存在しますが、随分前より廃止および非推奨となっています 代替案としてCSSで同じ動作が得られ、overflowにmarqueeを設定する方法とanimatio ...
【Search Console】「インデックス カバレッジ」の問題が新たに検出されました
「Search Console」が新バージョンになりインデックスエラーがあるとメールでお知らせしてくれる様になりました メールタイトルはこんな感じです 『サイト で「インデックス カバレッジ」の問題が新たに検出されました』 いちはやく問題に ...
【JavaScript】includes()で指定の文字列が含まれているかどうか判別する
includes()は対象の文字列に指定の文字列が含まれているかどうかを返します 大文字と小文字を区別し、第二引数では検索開始場所を指定可能です(未指定は0) 文字列検索処理が行える「match()」や「indexOf()」とは違って返り値 ...
【JavaScript】fromCharCode()でUnicodeを文字列に変換する
fromCharCode()は文字のUnicode値を文字列に変換デコードします 単一の場合 let text = fromCharCode(65); textには「A」と代入されます 複数の場合 let text = fromCharCo ...
【JavaScript】endsWith()で文字列の後方一致を判別する
endsWith()は対象の文字列が指定された文字列(単語など)で終わっているかどうかを判定できます(後方一致) 第一引数には判別する文字列を指定、第二引数では文字列の終わりの位置を定義でき未指定は末尾になります 返り値はtrueまたはfa ...
【Windows10】Update Assistantが日本語化された
Windows10になり自動Windows10アップデート機能の「Windows Update Assistant」の表示が日本語になりましたね 関連記事への検索からのアクセス数を見る限り、英語だったのは不安の声も多かったと思います 英語分 ...
【Googleアドセンス】広告掲載率設定のABテスト結果
このブログでの広告掲載率設定で20日間のABテストが完了しました 一日のページビューは少ないので同じく広告表示回数も少なく指標にはしにくいのですが20日間分と考えればそれなりに結果として参考レベルにはなるのかもです 広告掲載率とは 広告掲載 ...
【JavaScript】concat()で連結した文字列を取得する
concat()は指定した複数の文字列を連結した文字列を返す +演算子で連結した場合と結果は同じ A.concat(B,C) 上記の様に記述しますが「A」の中身は書き換わらない concat()の動作サンプル See the Pen Jav ...
【JavaScript】charCodeAt()で指定文字のUnicodeを取得する
charCodeAt()は文字列または文字から指定文字のUnicodeを取得できます 引数には文字列の先頭から数えた位置を指定し、未指定は0、負の数の場合は文字列の最後から数えられます 引数が整数以外だった場合や文字が見つからない場合は「N ...
【JavaScript】charAt()で文字列から指定した位置の文字を切り出す
charAt()は文字列から位置を指定して切り出す事が可能です 引数には文字列の先頭から数えた位置を指定し、未指定は0、負の数の場合は文字列の最後から数えられます 文字が見つからない場合は空の文字列が返されます charAt()の動作サンプ ...
「 Invalid argument supplied for foreach()」というPHPエラー
Invalid argument supplied for foreach() in~ 翻訳:foreachの引数が無効です 「Invalid argument supplied for foreach()」はforeachを利用する際に起 ...
【JavaScript】キーボード操作をトリガーにしたイベント
キーボードでの操作をトリガーにしたイベント実装のサンプルです キーボード操作イベント一覧(JavaScript) keydown キーが押されている時 keypress キーが押されている時 keyup キーが離された時 keydownとk ...
【CSS】簡単なフラッシュ(点滅)のCSSアニメーションサンプル
アニメーションキーフレームを利用して、要素を点滅表示させる簡単なフラッシュ(点滅)CSSアニメーションのサンプルです フラッシュ(点滅)アニメーションの動作サンプル See the Pen Flush element CSS Animati ...
【WordPress】投稿一覧に当日分・前日分のPV数を表示する方法
※この記事はプラグイン「WordPress Popular Posts」を利用しています 前記事で「WordPress Popular Posts」のデータを取得して管理画面の投稿一覧にページビューを取得して表示するところまでは出来ましたが ...
【WordPress】投稿一覧に記事のPV数を表示する方法
新しくソースコードを書き直した記事がありますのでそちらをよろしくお願いします 【WordPress】投稿一覧ページに記事毎のアクセス数を表示する方法 | ONE NOTE ※この記事はプラグイン「WordPress Popular Post ...
【WordPress】PHPで特定のカテゴリにだけ表示する方法
WordPressの特定のカテゴリにだけ表示するPHPサンプルコードのメモです in_category()カテゴリで分岐を設定できます <?php if(in_category(array('カテゴリ名1', 'カテゴリ名2', 'カ ...
【ANIME.JS】複数の連続したアニメーションを実装する方法
「ANIME.JS」で複数の連続したアニメーションを実装する方法です delayで開始時間をずらして繋いだり、Keyframes、タイムラインでの実装など様々な方法が用意されています delayのみで連続メーション この方法は簡単に利用でき ...
【ANIME.JS】複数の要素にアニメーションを指定する方法
「ANIME.JS」で複数の要素をターゲットにしてアニメーションを指定する方法です カンマ区切りやスペース区切りでそれぞれ違った複数指定が可能です カンマ区切りでor指定 targets: '#aaa , #bbb' 繋げて記述してand指 ...
【ANIME.JS】アニメーションに利用するパラメータ一覧
軽量で使いやすいアニメーションに特化した人気のJavaScript拡張ライブラリ「ANIME.JS」 「ANIME.JS」はCSSアニメーションの操作だけでなくSVGやDOMアニメーションの操作も可能です アニメーション関係のJavaScr ...
【ANIME.JS】CSSアニメーションの簡単なサンプルコード
軽量で使いやすいアニメーションに特化した人気のJavaScript拡張ライブラリ「ANIME.JS」 「ANIME.JS」はCSSアニメーションの操作だけでなくSVGやDOMアニメーションの操作も可能です アニメーション関係のJavaScr ...
【WordPress】カスタムフィールドでCSSやJavaScriptを記事毎に出力
記事毎にCSSを追加するにあたりプラグインの「WP Add Custom CSS」を利用してきましたが、プラグインを外した場合に過去の記事を修正する必要が出てきます 「WP Add Custom CSS」も、誤って外してしまい個別に記述して ...
【JavaScript】addEventListenerをclass名から利用する方法
「addEventListener」だけに限らないですが「getElementByClassId」のid指定だと動くけど「getElementsByClassName」のclass指定だと動作しない場合 const target = doc ...
【JavaScript】ドラッグ&ドロップをトリガーにしたイベント
ドラッグ&ドロップをトリガーにしたJavaScriptイベントの実装サンプルです drag&drop系イベント一覧(JavaScript) ドラッグ&ドロップする要素に適用するイベント名 dragstart ドラッグが開始さ ...
【JavaScript】画面スクロールをトリガーにしたイベント
スクロールをトリガーにしたJavaScriptイベントの実装 JavaScript:スクロールをトリガーにしたイベントの動作サンプル サンプルではwindowのaddEventListenerにトリガーイベントscrollを定義して実行して ...
【JavaScript】マウスオーバー(ホバー)をトリガーにしたイベント
要素上でのマウスオーバー(ホバー)をトリガーとしたイベントサンプルです CSSで言うところの:hoverですが、マウスカーソルが要素上に入った時・入っている時・動いている時・離れた時など、様々なトリガーが存在します JavaScript・j ...
【JavaScript】ダブルクリックをトリガーにしたイベント
ダブルクリックをトリガーにしたJavaScriptイベントの実装サンプルです JavaScript・jQueryそれぞれ、functionとアロー関数版 JavaScript:ダブルクリックイベント動作サンプル サンプルではダブルクリック検 ...
【JavaScript】右クリックをトリガーにしたイベント
要素上での右クリックをトリガーにしたJavaScriptイベントの実装 ブラウザのコンテキストメニュー以外の動作を指定したい場合に有効なトリガーイベントです JavaScript・jQueryそれぞれ、functionとアロー関数版のサンプ ...
【JavaScript】要素クリックをトリガーにしたイベント
要素クリックをトリガーにしたJavaScriptイベントの実装 JavaScript・jQueryそれぞれ、functionとアロー関数版のサンプルコードです 動作サンプル 動作サンプルではクリック数を表示しています See the Pen ...
【JavaScript】CSSアニメーションの開始・終了を取得してトリガーイベント
「Animation Events」はCSSのアニメーションの状態を取得してトリガーイベントを実装できます 「Animation Events」で取得できるイベントは「animationsyart(開始時)」「animationiterat ...
【Animate.css】スクロールに応じてアニメーション表示する方法
「Animate.css」のアニメーションを利用してスクロール量に応じて要素を表示していくサンプルです 色々な方法が考えられますが実装が簡単なものをまず 動作サンプル See the Pen Animate.css Scroll IN(jQ ...