1. ホーム /
  2. tamon1028

tamon1028

今流行のダークモードをjQueryで実装する！！–TamoTech–

今流行のダークモードをjQueryで実装する

2020年9月20日にiOS 13のアップデートが行われ，ついに！待望の！ダークモードが実装されました！！このダークモードって見た目がかっこいいだけじゃないんです！ダークモードには，低照度時の目への負担の軽減，消費電力の低減等の利点があります．今回はWebページにおけるダークモードを「jQuery」を用いて実装していきます．

続きを読む

カスタム可能！！カーソルを追従するアニメーションを作る！–TamoTech–

マウスカーソルアニメーション

今回はカーソルの追従アニメーションについて，実際のコードを踏まえながら解説していきます．普通のサイトと比べてカーソルにちょっとしたアニメーションがあると，サイトが映えますよね！映えるサイトは小さな工夫の集まりです．ぜひカーソルのアニメーションを採用してみてください！

続きを読む

簡単実装！！【jQuery】でオリジナルローディングアニメーションを作る！！–TamoTech–

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

今回はjQueryでオリジナルローディングアニメーションを作成していきます！ローディング時に，クルクル回る，待機アイコンや，進行バー，ロード状況のパーセント表示を一度はみたことが必ずあると思います．今回はシンプルだけど，おしゃれに見える，ロード画面の簡単な実装方法を紹介していきます！

続きを読む

すぐ使える！数値をカウントアップさせる関数【jQuery】–TamoTech–

カウントアップ,jQuery

Webページに数値データ（会社の売り上げ，社員数，アンケート結果等）を表示する時に，ただ数値を載せるだけでは，あまり注目されないことが多いと思います．自分が一番注目して欲しいデータは，何かしらの強調表現を付け加えなければいけません！強調方法は，デザインで補ったり，アニメーションをつけて補ったりします．今回は，数値をカウントアップさせ，Webページに動きをつける関数をjQueryで作成します．この関数は，初期値，終了値，アニメーション時間，イージング，要素を指定して使えるようにしています．ぜひコピペで使ってみてください！

続きを読む

上スクロールすると出現し，下スクロールで消える，メニューバーの作り方【jQuery】

上スクロール，下スクロール

WebページやWebアプリを使っている時に，「画面せまいな〜」とか「メニューバーがなければ良いのに」とか「今メニューバーいらんねん！」とか思ったことありませんか？？自分のWebページを作るときは是非今回の「上スクロールすると出現し，下スクロールで消える，メニューバー」を採用してみてください！モバイルファースを意識した，良いサイトになること間違いなしです！それでは，解説していきます！

続きを読む

CSSのグリッドレイアウトを使いこなす3つのステップ！ラインベースのグリッドレイアウトの基礎　–TamoTech–

グリッドレイアウトというものをご存知でしょうか？グリッドとは水平線と垂直線の集合が交差した，編み目上のものを指します．CSSではこのグリッド線を設定し，その線でボックスの配置位置を定義するグリッドレイアウトが可能です．これまで，フレックスボックスで配置してきたコンテンツをより「柔軟に自由に」配置できます．今回は，ラインベースのグリッドレイアウトを実装するための基本的な使い方を解説します．

続きを読む

超重要！!モバイルファーストでレスポンシブ対応なWebサイトを制作する時の5つの重要ポイント【レスポンシブ】–TamoTechBlog–

今回はレスポンシブに対応したWebサイトを作る時の，重要ポイントを解説します．結果から述べると，「レスポンシブ対応のサイトはモバイル版に全力をそそげ！」です．今回はモバイルファーストが以下に重要か，なぜPC版（デスクトップ版）ではないのかをじっくり解説していきます．

続きを読む