主にbranchコマンドを記載■git branch ・ローカルブランチの一覧表示 git branch・リモートブランチの一覧表示 git branch -r・ローカル/リモート全てのブランチを一覧表示 git branch -a・新しいリモートブランチを自分のローカルに持ってくる git branch n…
RSA 鍵の生成から配置、ログインまで■だいたいのやること ・鍵の生成 ・鍵がセットになってるか確認 ・鍵を配置 ・サーバ側でrsa公開鍵認証を有効にする(無効の場合) ・鍵のパーミッション設定 ・config設定でsshログインの簡素化(必要に応じ)■参考 http://q…
Apacheモジュール「mod_rewrite」機能 ■意図 検索エンジン対策などを考慮した場合、動的に生成されたページとわかるURLだと望ましくない場合があるため、対象機能でURL読み替えを行う。 ※oil createでpjt作成した場合は、デフォルトで記載済み。■ファイル格…
上付き/下付き文字で利用する要素(sup/sub) * ... ・supタグはsuperscriptの略で、上付き文字を表す際に使用します。 ・下付き文字はsub(subscription)を利用する。html <p>必須項目の印<sup style="color: red;">*</sup></p> ■参考 <sup>－HTML5タグリファレンス 上付き文字を表すsup要素＞テキストに意</sup>…
FuelPHPの概要■コントローラ----------------------------- ・コントローラは「class」として実装する。 ・コントローラクラス内のメソッドを「アクション」と呼ぶ。 ・コントローラの役割はおおきく３つある。 1.通常 Controllerクラスを拡張して作成する。…
スクロールボタン ■考え方 とある酒屋さんのコンテンツを想定した場合 ・画面をローディング時、「offsetメソッドで高さを取得」し変数へ入れる。 ・クリックイベント時、animate({scrollTop: topOffset }で、取得した高さまで移動する。※注意として、ready…
ハンバーガーメニュー ■考え方 ・span要素のみで、cssで装飾していく。 ・positionで配置 ・擬似クラス(::before,::after)で要素を追加する。 ・::afterは::beforeの直下に配置されるため、marginの取り方をうまく計算する。 ・表示されるコンテンツは、jQue…
カルーセル「Slick」 ■メモ ・RWD対応してるプラグイン ・カスタマイズが楽。css,jsなど必要なものはマスターからコピーして所定のディレクトリで管理。それに合わせてパス修正。 ・.slider,.slick-slideクラスあたりでcssを整える。 ・埋め込みは外部ファイ…
プラグイン「Lightbox」 公式よりDL。 Lightbox サンプルのindex.htmlがあるため、使いやすい形に修正する。 今回は画像はサムネイルとメインの２つを用意。 ■コード html <html lang="en-us"> <head> <meta charset="utf-8"> <title>Lightbox Example</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </meta></head></html>
プラグイン「bxSlider」 ■インストール（公式抜粋） Step 1: Link required files →HTMLでjQuery,bxsliderjs,cssを読み込み Step 2: Create HTML markup →スライドさせたいイメージをマークアップ。 Step 3: Call the bxSlider →.bxsliderクラスに対してslid…
ファインダーからパスをコピー ■手番 ・対象ファイル/ディレクトリを、「control+右クリック」でコンテキストメニュー表示 ・その状態で⌥(option / alt)を押下 ・[◯◯のパス名をコピー]へ表示が切り替わる。※El Capitan からは標準でその機能は実装済みの模様…
ブラシのプリセット追加 ■手番 事前準備 ・フリーのブラシのプリセットファイル(.abr)をダウンロードする。 ・.abrファイルをプリセット格納場所に移動する。 /Applications/Adobe Photoshop CC 2017/Presets/Brushes/~~.abr ココ★ ※Photoshopの再起動が必要…
エッジ（境界線を調整）機能」で女性の髪を綺麗に合成する ■手番 ・対象人物を「クイック選択ツール」で枠を取る。 ※背景と図の反転は「cmd+shift+i」 ・ツールバーの「境界線を調整」を選択。 ※最新verの「選択とマスク」 ・以下の項目を調整し、OKを押下す…
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…
さくらVPSにPHP環境構築 やったこと■環境 CentOS6.9■ユーザ作成 -uid,pw作成 -wheelGr add -sudoユーザの環境変数設定(sbin,usr/sbin,usr/local/sbin) -sshのポート変更(/etc/ssh/sshd_config)■環境日本語化 -/etc/sysconfig/i18n■iptables -ポートフィルタ…
ヒーローヘッダー（マルチイメージ） ■考え方 ・２カラム(header,container)でfloatをかける。 ・高さは単位vhで調整。 ・横は%指定。 ・headerのロゴを中央指定★ポイント■コード html <body> <header> <img src="img/logo.svg" alt="logo"> </header> <div id="container"> <div class="ph topL"> <div class="text"> <h2>Frog</h2> <p>~Episode1~</p> </div> </div> <div class="ph topR">…</div></div></body>
hover(border-bottom)でリストがずれないやり方 ■考え方 あらかじめborder-bottomを入れておく。 色は背景色ど同色にしておき、hover時に上書きで色を変更する。 ※レスポンシブ対応でliを上下させた際にガタガタとカラム落ちする場合があるためそれの防止の…
ヒーローヘッダー ヒーローヘッダー（Hero Header）とは、ウェブサイトのファーストビューに全画面の画像を使用するなど、巨大なイメージで構成されたウェブサイトのことを指します。（引用） ■考え方 ・ビューポートの高さを考慮( E { height: [x%/100%]vh …
CSSシグネチャー 各index.htmlのbody要素にidを指定し、cssで対象idを指定して記述していくやり方。■利用シーン ページが遷移するたびに、body(背景色)を変更させる場合など■記述 ・各index.htmlのbody要素にidを付与 ・各index.htmlのtitleを変更 → neko-ca…
文字をアーチに沿って描く ■手番 1.楕円形ツールで円を描く 2.パス選択ツールで円の下を選択しdelete。(半月ができる) 3.パス上文字ツールで円の上にテキストを入力し、「cmd+shift+c」でセンタリングする。 ※左寄せはL,右寄せはRをCの代わりに入力 4.選択ツ…
セレクタ指定 jquery/1.12.4/jquery.min.jsあとで整理します。^：〜から始まる $：最後がvalueで終わる→[attribute$=’value’] gt：greater than attr：アターって読む。 ・JavaScriptはhtml操作、jQueryはcssの操作、必要に応じincludeの中身いじって軽量化 …
三項演算子 構文 条件式 ? 式1 : 式2※タイトルはPHPとついているが、演算子なので他言語でも同様
リキッドデザイン(2カラム)で１カラムのみ横幅を固定（width:calc(XX% - YYpx)） width:calc(XX% - YYpx);■利用シーン リキッドデザインでサイドバーに広告を載せており幅を固定し、コンテンツだけリキッドとする場合。 ※caniuseでほぼ全てのブラウザで利用…
ファイル全体がPHPである場合終了タグは記載しない 要約 ・ファイル全体がPHPである場合、終了タグは省略可(Zend FWではむしろNG並の勢い) ・HTML内の記載では必須。この埋め込みがあるため、省略選択の仕様になっている。 理由 ・終了タグ直後の改行（１行…
クエリ情報 ・URLの末尾に[キー名=値]で情報を渡せる。 ・詳細ページに飛んだり、その商品のレビューページに飛んだりするときに利用。 ・値は$_GET['キー']; ※連想配列として値が格納 ※valueはechoで出力が必要index.php <a href="detail.php?name=<?php echo $menu->getName() ?>"></a> detail.php ... <p></p>
継承 ・子クラスは親クラスのプロパティ/メソッドを利用可能。 逆に子でユニークなものを親は利用不可。 ・instanceofでどこのクラスか判別可。 ・コンストラクタをオーバーライドさせる場合、子クラスでは[parent::__construct(...)]とparentを使う。
