jQuery
シングルページサイトをつくる メインビジュアルをヒーローヘッダーでbxsliderを使用 VIDEO部分にmp4データを設置 NEWS部分をjQuery / ajaxを使用して外部データを読み込む MENU部分にjQuery / モーダルウィンドウを設置 ACCESS部分にGoogleMapを設置 INFO部…
店舗サイトをつくる レスポンシブ化（ブレイクポイント：640px） SP時にメニューをハンバーガーメニュー（ドロワーメニュー）にする スムーススクロールでアニメーションしながらトップに戻る h1にgoogle fontsを適用させる GoogoleMap（南池袋公園）をサイ…
「TOPへ戻る」ボタン Font Awesome Iconsで設置 過去の記事の際のIllutratorでボタンをつくる手間がなくなります。 jQueryで動作設定 初期画面ではマークがでず、ある程度スクロールするとボタンが出ます。 SP表示でボタンが表示されます。（PC表示ではボタ…
店舗サイトをつくる モバイルファースト 前回の実践のHTMLを利用して、CSSをモバイルファーストで作成します。 モバイルファーストとは 主にスマートフォンでストレスなく利用できるデザインにすること。 モバイル：スマートフォン、タブレットなど 主にスマ…
店舗サイトをつくる（応用編） PSDカンプからコーディング クラス名「container」で、横幅960pxに統一 header h1（左）とナビゲーション（右）が横並び スライダーを設置：カスタマイズ main h2とp（キャッチコピー）は、１カラム おすすめ写真３点が横並び…
(2020-04-27 加筆) bxSliderを設置する jQueryプラグインのスライダー スマートフォン、タブレットなどのレスポンシブにも対応しています。 ＜bxSlider＞ bxslider.com 方法１：head内にCDNで読み込む CDN＝Content Delivery Network：ネットワーク経由でコ…
Hatena Blogの設定 はてなダイアリーからHatena Blogに変わったため、各種設定をメモします。 編集モード 「はてな記法モード」を使用します。 設定＞基本設定＞編集モード＞はてな記法モードを選択 後に出てくるソースコードを色付きで表示できます。 help.…
Illustratorでボタンを作る 100×100pxの正円 上向きの三角形 png-24で書き出し 見やすいサイズでお好みで作成してください HTMLとCSSを記述 【index.html】 <html lang="ja"> <head> <meta charset="UTF-8"> <title>トップへ戻るボタン</title> <link rel="stylesheet" href="css/style.css"> </link></meta></head></html>
jQueryとは JavaScriptのライブラリのひとつ ブラウザ依存ではない 記述がCSSに似ている 利用方法 2.xは旧ブラウザには対応していないので（IE6〜8）1.xを使用しています HTMLのhead内か、bodyの終了タグの上部に記述します ダウンロードして利用 iQuery jQu…
