ウェブ制作

Macでスクショの保存場所を変更してpngをjpgに変更するまでやっちゃおう

毎回MacPCを新しくして、毎回同じ一連のコマンドをググってやるのが面倒なので、 Macのスクリーンショットの保存場所を変更png保存のものをjpg保存に変更 のコマンドをメモメモ... スクリーンショットの保存場所を変...
アイドル

RAYの「愛はどこいったの?」が最高過ぎる

シューゲイズアイドルのRAYの「愛はどこいったの?」が収録されたコンピレーションアルバム『Total Feedback 2020』が2020年10月21日に発売されました。 私は、RAYの大ファンだがシューゲイザーな曲が...
ウェブ制作

metaタグのviewportを理解するために簡単な言葉でまとめてみた

レスポンシブ・リキッドレイアウトのサイトを作るにあたって、 <meta name="viewport" content="width=device-width, initial-scale=1.0"> この設定をやってい...
ウェブ制作

Gutenbergのリンク・外部リンク設定の種類と効果をまとめて紹介(WordPress)

はる 外部リンク時の設定の種類と効果について紹介します!WordPressのGutenbergエディターの設定に沿って紹介していきたいと思います! WordPressのGutenbergでリンクを設定する際に、『新しいタブで開く』...
ウェブ制作

ゴーストボタンの背景を左から右へ受け流すアニメーション実装方法【ホバーアニメーション】

はる ボタンをホバーすると左から右へ背景がアニメーションさせるCSSの方法を紹介します。その応用方法も、紹介するので覚えておくとさまざまな場面で使えます。 今回は、CSSアニメーションで、左から右へと背景や線画流れるようなアニメー...
ウェブ制作

最もシンプルなモーダルメニューの作り方【簡単なCSSとJavaScriptで実装】

はる 一番簡単で使う場面が多いモーダルの作り方を紹介します。簡単なモーダルであればこの方法を使えば素早く実装できます。 モーダル表示されるメニューとして紹介しますが、メニューリストの代わりにYouTube動画を埋め込んで、サムネイ...
ウェブ制作

ページ表示時にYouTubeのiframe埋め込みを自動再生させる方法

はる Youtubeのiframe埋め込みして、自動で再生させたい時の設定方法と、できる条件についてまとめました。特定条件なら自動再生させることができるので紹介します! ページ表示に、iframe埋め込まれたYouTube動画を再...
ウェブ制作

CSSだけでスムーススクロールを実装する方法

今回は、同じページ内のアンカーリンクで、ゆっくりスクロールされる『スムーススクロール』をJavaScriptを使わずに、CSSだけで実装する方法を紹介します。 CSSだけでスムーススクロールを実装する方法 デモ S...
ウェブ制作

画像を拡大表示させるプラグイン【ポップアップ・モーダル機能】Easy FancyBox の使い方を紹介

今回は、WordPressで記事本文中に画像をクリックすると拡大された画像がモダール(ポップアップ)で表示されるようにするプラグインを紹介します。 記事本文の画像をモーダル(ポップアップ)で拡大表示させたい!シンプル十分! と...
ウェブ制作

【JavasScript】モーダルでの枠外をクリックしたら発火させる方法

はる 今回は、JavaScriptのよくある『モーダル(ポップアップ表現)を閉じる』時に外枠をクリックしたら閉じる判定方法を紹介します。 モーダル(ポップアップ)作成時の外側をクリックするときの判定を紹介注意はIE11は非対応の...
タイトルとURLをコピーしました