javascript 【javascript】コピペで簡単にスライドショーを設置する方法【Swiper.js】
自力でスライダーを設置するのは簡単だが、スライダーの「当たり前」機能を付けるのがすごい手間だったりする。 「レスポンシブ対応」や「スワイプやマウスオーバーでの操作」、「スライドの数が増えた時のスクリプト、スタイルの修正」、「Next,Pre...
javascript 
CSS 【CSS】画像を隙間無く横並びにするいくつかの方法
画像を横並びにする時なぜか空く隙間。 その隙間を埋めてレイアウトする方法をいくつか紹介します。 CSSでのレイアウトで利用しやすいものをご利用ください。 【inline-block】で横並び 要素を横並びにする時よく使うのが「display...
CSS 【CSS】テキストの縦書き！
「和」を感じさせるサイトや、「西尾 維新」のサイトのように原稿をテーマにしたサイトを作る時、必ず必要になるHTMLでの文章の縦書き方法を解説。 文章の縦書き 全ブラウザがこのタグに対応しているが、IE11だけにはベンダープレフィックスを付け...
HTML 【HTML】外部ファイルの読み込み方法
HTMLで外部ファイルを読み込む時、CSSとJSファイルでは書き方が違うから「あれ？」って忘れがち。 そんな外部ファイル群の読み方まとめ。 外部ファイルには、画像やビデオなどの「コンテンツファイル」と処理が書かれた「プログラムファイル」が存...
CSS CSSはどこに書くのが最適なのか
CSSの書くところは大きく分けて３つある。 インラインで書く HTMLファイルに直接記述する。 インラインで書く場合、なるべく「head」内にスタイルを記述。 「head」内に書かなくてもスタイリングできるけど、コードが読み辛くなるのでなる...
CSS ニューモフィズム・ジェネレーター
2020年3月現在。最近流行っているニューモフィズムのジェネレーターがあると聞き使ってみたくなった。 そもそもニューモフィズムってな～に？ ニューモーフィズムは、一昔前に流行った「スキューモーフィズム」のリアルな質感と、フラットやマテリアル...
CSS ドラッグで変化するカーソルの作り方｜CSS
Swiper.jsなんかを使う時、ドラッグして横にスライドできるけど 矢印のままじゃユーザーに分かりずらいから、 ちゃんとスライドできる範囲は「パー」にしてドラッグしたら「グー」にするCSS。 【DEMO】 お分かりいただけただろうか？ エ...
CSS CSS｜iOS safariで滑らかスクロール
iOSで厄介な挙動をするCSSの「overflow:scroll;」でいつも通りの慣性スクロールを実現。 -webkit-overflow-scrolling: touch;
CSS CSSの「position relative」の役割
「position:relative;」って何のためにあるの？ その疑問を解決します。 「position」とは そのままポジション（位置）を整えるプロパティ。 次に、どの様にポジションを整えるかというと「relative（相対的）」？ 「...
CSS CSSで背景に色を設定する方法
背景の色は、基本どこも白が多いけれど、特設サイトやブランドカラーがある場合 背景にカラーを適応すると、サイトの印象がガラッと変わります。 今回は、印象的なサイトを作るための背景色変更方法を解説します。 まずは背景に色を追加してみよう！ 背景...
javascript jQueryで要素の数を取得｜divやliを数える
jQueryで要素の数を取得｜divやリストを数える リストの数を取得して何かする時や、リストにしていなかった要素の数を調べる時に便利なjQueryの記述のご紹介です。 リストの数を取得 <div class="list"> <ul> <l...
javascript jQueryの使い方｜CDNとダウンロード
jQueryを利用するなら最新版を使っておけば問題ないよ jQueryを利用しようとした時に、「jQuery3.4」とか「jQuery2.2」とか「jQuery1.1」とかの リンクがあるけど最初のうちってどれを使ったら、どんな効果があるか...
PHP 【初めてのPHP】echoで文字を表示
フロントを作ってるとPHPって聞いたことあるけど、始め方が分かんない状態がずっと続く。 覚えたくても、なんだかムズそうで興味だけって期間が1年2年3年。。。。。この状況を打破するため手っ取り早く始めてみよう！ そこで今回は、文字を表示してみ...
javascript jQueryでaタグのURL(href)取得方法
jQueryでaタグのhrefを取得するには、「$('a').attr('href');」を使います。
「$('a').attr('href');」を使ったDEMOと説明は下に書いていますので、よろしければ見てください！
HTML HTMLだけ（iframe）で別ページを表示させる方法
別ページを、このページ内にHTMLだけで取得する方法のご紹介です。 自分は別ページの情報を取得するのは、phpの役目と思っていました。が、 「iframe」で取得できることを最近知って驚いたので記事にしました。 「iframe」で別ページを...
