javascript
-
2020/02/29 / javascript
特定の要素の幅と高さを取得するjavascript
divなど、特定の要素の幅と高さを取得する方法 <div id="fr">幅と高さを取得したいボックス</div> let client_w = document.getElementById('box').cli...
続きを読む
-
2020/02/29 / javascript
ウィンドウ幅リサイズごとにブラウザをリロードするjavascript
$(function(){ var timer = false; var prewidth = $(window).width(); $(window).resize(function() { if...
続きを読む
-
2020/02/01 / 便利ツール
パソコンアプリケーション
MacからWindowsへ圧縮ファイルを送信するときに文字化けしない圧縮アプリ https://tida.co.jp/macwinzipper ...
続きを読む
-
2020/01/13 / EC-CUBE4
サブディレクトリ(/shopfr/)にインストールしたEC-CUBE4.0.3をドメイン直下に表示する
例） sample.com/shopfr/ に EC-CUBE4.0.3のファイル群をアップロードし、お店のTOPページが、 https://sample.com/shopfr/となるTOPページを https://sample.com/...
続きを読む
-
2020/01/04 / 便利ツール
Unicode正規化(NFC・NFD・NFKC・NFKD) 変換・PDFコピペの濁音分解をひとつに
変換する文字列 NFC NFD NFKC NFKD ↓ 変換した文字列 例えば...PDFからコピーペーストした濁音（が、ば...）や半濁音（ぷ、ぱ...）が分解されることがありますね。 こ...
続きを読む
-
2019/12/25 / html+css
Pリンクボタン中央寄せ
HTML <div class="pafelinkbk"><p><a href="/official/price/">お問い合わせ</a></p><p><a href="/official/...
続きを読む
-
2019/12/12 / javascript
サイトにローディングを実装するjavascript
HTML 全てのページでローディングする必要がないときは、HOME PAGE（TOPページ）にのみ記載 <div id="loading"> <div id="loading-in"> <img src="...
続きを読む
-
2019/12/12 / html+css
HTMLの複数行を左揃え中央寄せする
HTML <div> <p> テキストテキストテキスト<br/> テキスト<br/> テキストテキストテキスト </p> </div...
続きを読む
-
2019/12/05 / wordpress設計術
ループ記事を古い順に並べる【wordpress】
シンプルなループの一番上にquery_postsでorder=ascを入れる <?php if (have_posts()) : ?> <?php while (have_posts()) : the_post(); ?...
続きを読む
-
2019/11/25 / wordpress設計術
Advanced Custom Fields テキストエリアの改行文字列をリストタグ（li）で囲む【wordpress】
Advanced Custom Fields テキストエリアの改行文字列を＜li＞（リストタグ）で囲む 「名前1」を割り当てた名前（半角英数）に変更 <ul> <?php $fieldData = explod...
続きを読む
-
2019/11/22 / 便利ツール
画像が加工できるwebサイト
写真の背景を切り取れる https://www.remove.bg/ ...
続きを読む
-
2019/11/22 / wordpress設計術
Advanced Custom Fields の表示【wordpress】
基本の表示 <?php the_field('フィールド名1'); ?> 2023年以降 <?php echo get_field('フィールド名1'); ?> 値が設定された時だけ表示する <?...
続きを読む
-
2019/11/22 / html+css
::before ::after【css】
CSS3から::before の表記法（二重コロン）が導入されました。 h2::before {content:"» ";} h2::before {content:"『";} h2::after {content:"』";} ...
続きを読む
-
2019/11/21 / wordpress設計術
Custom Post Type UIのテンプレート【wordpress】
投稿タイプの追加と編集で作った1ページずつのファイル single-●●●.php ●●●は投稿タイプスラッグの名前 URL：ドメイン/●●●/記事のスラッグ/ 投稿タイプの追加と編集で作った1ページずつのファイルの一覧 categor...
続きを読む
-
2019/11/21 / wordpress設計術
Custom Post Type UIカスタム投稿の表示【wordpress】
ターム（taxonomy-●●●.php）の出力 ●●●をタームの名前に変更 PAGE NAVIプラグインと使える タームの名前を取得 <?php $term = get_the_terms($post->I...
続きを読む
-
2019/11/21 / wordpress設計術
Advanced Custom Fieldsでチェックボックスの値を表示する【wordpress】
Advanced Custom Fieldsでチェックボックスの値をリストで表示する field_name を自分が設定した名前に変更 <ul> <?php $cfcb = get_field_object('fiel...
続きを読む
-
2019/11/21 / html+css
dl,dt,dd・シンプルにコピペ
dlはdt要素（用語）・dd要素（その用語に対する説明）をともなう記述型リスト <dl> <dt>用語</dt> <dd>説明</dd> <dt>用語</dt> <dd>説明</...
続きを読む
-
2019/11/21 / wordpress設計術
自分が所属するカテゴリーをリンク無し・有りで表示【wordpress】
リンク無し <?php $cat = get_the_category(); $cat = $cat[0]; { echo $cat->cat_name; } ?> リンク有り <?php the_categ...
続きを読む
-
2019/11/21 / wordpress設計術
投稿記事全てのリストをpage.phpに表示【wordpress】
wordpressの投稿記事をカテゴリー別ではなく、全てのカテゴリーの記事をpage.phpでで表示させる方法 'posts_per_page' => 10, 1ページに何記事表示させるか page.phpに下記を記載 &l...
続きを読む
-
2019/11/19 / html+css
テーブルhtml・シンプルにコピペ
上に th が並ぶシンプルテーブルHTML <table> <tbody> <tr> <th></th> <th></th> </tr> <tr> <td></td>...
続きを読む
HOME > Tecnical Note
javascript
- slick sliderで逆にすると画像が表示されなかったり途中で切れる場合
- slick sliderのサムネイルを縦に流す
- formのoninput-output。結果を3桁ごとにカンマが入る数値タイプに変換
- マウスオーバー・マウスアウト（スマホの時はクリック）で画像を切り替えるjquery。
- querySelectorAllエレメントのhrefをforEachで削除する
- jQuery,Masonry,imagesloadedで画像を敷き詰める
- jQueryで特定のページからリンクされた後のページでclassを追加
- カレンダー
- 特定の要素を持っていたら（あったら）jQuery
- スクロールすると上からニョキッと降りてくるメニューjQuery
- マウス・マウスホイールで横スクロールするjavascript
- 横スクロール要素をマウスホイールで動かせるjavascript
- jqueryとcssでタブ
- 特定の要素を持つ時にclassを付けるjQuery
- スクロールして現れたらアニメーション（フェード等）開始jquery
- MOREボタンで数件ずつ要素を表示wp
- slick 基本
- スクロールして表示するとフェードイン
- スクロールして表示されたタイミングでアクションを起こすjs
- スクロールするとメニューが上からゆっくり降りてきてヘッダー固定・Y座標0でメニューがスムーズに上がる（消える）
- Enterキーを押すとinputが空欄になるのを防ぐ
- jsでふわふわ縦に揺れる
- ウィンドウ幅リサイズごとにブラウザをリロードするjavascript
- サイトにローディングを実装するjavascript
