2017-05-31から1日間の記事一覧
CSSのみでのキャプションエフェクト ■考え方 ・positionレイアウト ・キャプションはimgの下に配置しておき、overflow:hidden;で非表示にしておく。 ・hoverでpositionのbottomを変更し表示する。 ・リセットcssにfigure,figcaptionなど入れ忘れに注意。■コ…
デザインカンプの書き方 ■ポイント ・pxで設計するためカンプができたら実装はただの作業になる。 ・ファイル新規作成の際に「ピクセルグリッドに整合」を外す ・一番最初にコンテナーにあたる一番大枠を長方形ツールで描く。 →オブジェクトは「cmd+5」でガ…
要素内外への要素挿入(prepend,append,before,after) ■ポイント ・対象要素の外側：before(); afret(); ・対象要素の内側：prepend(); apend(); ・テキストの変更：text();■コード <html lang="ja"> <head> <meta charset="utf-8"> <title>jQueryの基本</title> <meta name="description" content=""> <link href="css/style.css" rel="stylesheet"> </link></meta></meta></head></html>
表示・非表示のメソッド ■ポイント ・主要なメソッドの種類 hide,show slideUp,slideDown toggle fadeIn,fadeOut ・時間の指定 ('slow'),('2000') ・アニメーション実行中は次の処理を受け付けない $('#box:not(:animated)').slideUp('2000');■コード html埋…
アコーディオン ■ポイント ・利用：Google CDN: jQuery 1.12.4 ・N件同一要素がある中で、クリックされた箇所の要素の指定の仕方 ※隣接セレクタの使い方 ※$('+dd',this)、$(this).next()、etc... ・選択中の要素に色をつける（クラスを付け外しする） ※addCl…
