Technique | Page 2 of 3

Googleマップをレンスポンシブに対応する方法

Googleマップを埋め込んだサイトはよく見かけますが、そのまま埋め込んだだけだとレスポンシブに対応できません。ですので今回は「Googleマップをレンスポンシブに対応させる方法」をやっていきたいと思います。 &nbsp […]

2018/09/07

前回「フルスクリーンナビゲーションを作る。(シンプルバージョン)」という記事を書きました。今回はスプリットレイアウトバージョンのフルスクリーンナビゲーションを作って行きたいと思います。こんな感じになりました。サンプル […]

2018/07/05

先日「フルスクリーンナビゲーションの参考サイト15選」という記事を書きました。今回は実践編をやっていこうと思います。シンプルに縦に並ぶフルスクーリーンナビゲーションを作ります。サンプル1 HTML 極力 […]

2018/06/29

flexboxとは flexboxとは「Flexible Box Layout Module」のことで、CSSでのレイアウト設定を簡単にするレイアウトモジュールです。今までjavascript・jQueryで行っていたよ […]

2018/05/21

当サイトの目次でもやってますが、縦長のランディングページなんかを作る場合、グローバルナビゲーションはページ内リンクにして、スムーズにスクロールさせるパターンがよくあります。ですが、特定のページを別ページにしている場合、 […]

2018/01/14

スクロールしても固定表示されるヘッダーは珍しくありませんが、その方法はいくつかあります。今回は5つのパターンでサンプルを作成してみました。最初から固定表示基本なので言わずもがなですが一応。単なる固定表示 […]

2017/12/28

以前「スプリットレイアウトの参考になるサイトまとめ」という記事を書きましたが、今回は実践編として実際にスプリットレイアウトのサイトを作成していきたいと思います。サンプル 01.スプリットレイ […]

2017/12/05

世の中にはたくさんのスライダープラグインがありますが、今回はレスポンシブ・タッチデバイスに対応、オプション設定も豊富なスライダープラグイン「slick」の使い方を詳しく解説していきます。 slickの機能概 […]

2017/11/30

要素をブロックの縦横中央に配置するというシーンはたくさんあります。横の中央揃えは簡単です。「margin:0 auto」か「text-align:center」で指定できます。ですが、縦中央揃えは「margin:aut […]

2017/11/24

スクロールをセクションごとに制御してくれるプラグイン「jQuery Scrollify」。主に縦に長いLPなどでよく使用されているので、ちょこっとスクロールしただけで、次のセクションまでスルスルとスクロールしていくサイト […]

2017/11/17