2023-08-04

選択範囲を滑らかにする方法

デザイン

Photoshopで選択範囲や境界線を調整する方法！【拡大・縮小・追加・解除】 | Creators＋

2023-07-30

flex-boxの順番変更

コーディング備忘録

flex-direction - CSS: カスケーディングスタイルシート | MDN

2023-07-24

WordpressでJQueryを使用するとき

Wordpress

jsファイルが反映されない〜と悩んでいたところ、

下記の記事でやっと解決した

WordPressでjQueryが動かない原因＋解決策３つ | マコブログ

②の方法を試したらいけた！

ありがとうございます

jQuery(function($){
  // この中であれば「$」使用可
});

2023-07-24

ローディングアニメーション

コーディング備忘録

ローディングアニメーションの導入方法

CSS コピペだけで実装できるローディングアニメーション！ | Recooord | Web制作で扱うコーディングスニペットを紹介

今回使用したアニメーション

Single Element CSS Spinners

テスト環境ではうまくいったのに本番ではjsファイルが動かない

2023-07-22

スクロールに合わせて背景画像の位置を動かす方法

コーディング備忘録

これよく見るけどやったことなかったやつ

意外と簡単に実装できた

cssは背景画像をno-repeatにするとレスポンシブのときに高さが全然足りなかったので指定しなかった

以下js

$(window).on('scroll', function(){

  var scrollTop = $(window).scrollTop();
  var bgPosition = scrollTop / 2; //スクロール後のポジションを指定（値を大きくすると移動距離が小さくなる）

  if(bgPosition){
    $('#app').css('background-position', 'center top -'+ bgPosition + 'px');
  }
});