Webの基本レイアウトまとめとサンプルコード

はじめに 上部ナビゲーション型 左軸ナビゲーション型 逆L字ナビゲーション型 シングルカラム マルチカラム フルスクリーン 3分割縦型 逆U字型 グリッドレイアウト 余白多めのレイアウト ニュース系情報サイト ECサイト 最後に 参考書籍&サイト はじめに最近…

propellerkitでリストのアコーディオン実装

はじめに 利用するもの リストデザイン アコーディオンの実装 ポイント解説 さいごに はじめにアコーディオンとは、クリックすると隠れていたコンテンツがずる〜っと現れるアレです。 今回はこのアコーディオンを作成していきます。完成形はこちらです。 利…

自作Markdown記法とプレビュー機能の作り方

Markdown記法とは 利用するもの MarkdownをHTMLに変換 プレビュー機能 おわりに Markdown記法とははてなブログやQiitaなど様々なところで使われている記法です。 Markdown(マークダウン)は、文書を記述するための軽量マークアップ言語のひとつである。本来…

AngularJSでいいねボタン作成

利用するもの ボタンデザイン クリックすると値が増える機能 クリックするとデザインが変わる機能 1度しかクリックできない機能 利用するもの ・AngularJS ボタンクリック時などの各種機能を作る際に利用します。 ※当記事は、AngularJSをある程度理解してい…

グローバルナビの作り方

こんな感じのやつ機能としては クリックしたナビに下線 ナビに応じて画面内容も変更 くらいかなあ。 調べてみると色々なやり方があったけど、今回は主にAngularJSのng-styleを使用してみた。 もっと効率の良い方法があると思うので見つけ次第変更していく予…