傾きがでている写真の補正の仕方。 ものさしツールで垂直、もしくは水平にしたい箇所を引く。 メニューバーから[イメージ]→[画像の回転]→[角度入力]で自動的に物差しツールで指定した角度が自動的に入力されているので、それで修正する。 傾きが補完されると…

home_url メソッド サイトのホームURLを表示 home_url('/'); 説明 '/'を入れることでURLの末尾に'/'がつく bloginfo メソッド ブログの情報を取得、出力 bloginfo('パラメータ'); name ブログタイトル description ブログの説明 url ブログのURL template_ur…

PHPのユーザー定義関数でWordpressのテンプレートタグを呼び出す書式を設定し、ユーザー定義関数ブランケット外に add_shortcode(ショートコード名、呼び出し関数)とする。 functions.php function b_info-d(){ return get_bloginfo('description'); } add_s…

電話番号,メールアドレスの自動リンク制御 スマートフォンにはサイト上に表示された電話番号の数字をクリックすると自動的に通話アプリを起動する機能がありますが 電話番号以外の数字(郵便番号、IPアドレスなど)をクリックしても自動に起動してしまうのをme…

jQueryのanimate()メソッド animate({"プロパティ":"値"},スピード) このスピード部分に数値でミリ秒、"slow"や"fast"などの文字列指定。このままだとanimateの動きが機械的な単調な物になるので「Easing」プラグインを入れて 自然な動きが演出するようにす…

transitionでアニメーションを transitionはjQueryなどを使用せずCSS3のみで簡単なアニメーションを施す機能である。 transitionのプロパティ transitionのプロパティの記述方法は transition:transition-property␣transition-duration␣transition-timing-fu…

floatを使用せず,table,tdのように簡単に横並びできる display:table。 主な設定は親要素にdisplay:table。 子要素にdisplay:table-cellを付与する。 html <section id="first"> <h2>display:table <span>-floatを使わない横並び-</span></h2> <ul> <li>chapter01</li> <li>chapter02</li> <li>chapter03</li> </ul> <p>子要素の&lt;li&gt;にdis</p></section>…

vertical-alignプロパティは行の中のテキストや画像の位置を指定します。 webだけでなくDTPにおいても知って損のない、綺麗な文章を組むのに必要な知識なので覚書します。 値の主な位置 (1)行の高さはline-hight。 そこから,topとbottomが決められます。 (2)…

スポット修復ブラシツールで修正 1- 電柱一本だけで無駄に存在感が綺麗な風景を阻害していたりする時に、コピースタンプツールで周りの風景に溶け込ませるようにするが、それが一つだけでなく複数あると修正処理だけで手一杯になります。 そんな時は大雑把で…

(1)編集>塗りつぶし>使用：コンテンツに応じる 周りのテクスチャにあわせて選択範囲内を塗りつぶしたい時に使用。 Step.１ 周りのテクスチャで塗りつぶしたい範囲を選択。 Step.２ 編集>塗りつぶし>使用：コンテンツに応じる。で周りのテクスチャで塗りつぶ…

以前の記事で紹介した湯気の表現とは違う方法でもっと素早く描く。 (1)ソフト円ブラシで湯気の煙を書き込む。 (2)フィルタ>ぼかし>ぼかし（ガウス）の効果でより湯気らしく表現する。 (3)フィルタ>変形>波形で湯気の気流表現を強調。 フィルタ>変形>波形の設…

テキストフィールド(TextField)をActionScriptから作成します。 "var インスタンス名:TextField = new TextField()"で宣言。 "this.addChild(インスタンス名)"で現在のステージに表示。 文章や、フィールドの枠線、背景色は下記の指定プロパティに登録する。…

addEventListenerのイベントの種類 MouseEvent-(マウスを操作する） Keyboard-(キーボードを操作する) ENTER_FRAME-(フレームが進むごとに) Timer-(一定時刻に) MouseEvent マウスで特定のアクションをきっかけにステートメントを実行する。 インスタンス名.…

addEventListenerを使えばインタラクティブな操作ができる。 メソッド イベントが起きたら任意の命令を実行する イベントターゲット.addEventListener(イベントタイプ,リスナー関数); 第1引数 イベントタイプ 戻り値無し 第2引数 リスナー関数 "操作出来る"…

ムービーの再生・停止 再生中のムービーの停止 メソッドムービーを停止 stop(); 引数無し 戻り値無し 停止中のムービーの再生 メソッド ムービーを再生 play(); 引数無し 戻り値無し タイムライン上のムービーを任意のタイミングで再生・停止 指定先のフレー…

基本的にＰＨＰなどのユーザー定義関数と変わりないが、任意の関数名の後に”:void”などの様にやりとりするデータの型に応じてNumberやStringなどを添え付ける。 function 任意の関数名():void{ この作業を実行する。 } 定義した関数の引数に数値などを入力し…

ステージにダイナミックテキストツールでテキストボックスを配置。インスタンス名は「disp_txt」。 別レイヤーを作成。アクションパネルを開いて以下の様に記述。 disp_txt.text = "ActionScript3.0" 制御＞ムービープレビューで実行。ステージ上のテキスト…

セリフ体 欧文書体で文字の先端にヒゲのような飾りが出来ているものをセリフ体といいます。セリフ体は大きく分類して4つあります。 ブラケットセリフ 接続部分が曲線を描いている。 ヘアラインセリフ 接続部分が太い線と細い線で繋がっている。 スラブセリフ…

アンチエイリアス設定 illustratorでweb制作環境を整える際、媒体が紙でなくディスプレイなので環境設定>表示>ピクセルプレビューにする。 ただ、そうすると線1px、50x50pxの図形を描写すると、実寸が52x52pxとなってしまう。 これは、線にアンチエイリアス…

emは親要素のフォントサイズを参照する。 一方、remはroot(根っこ、最も祖先の親)要素を参照にしている。 html <section> <p id="em">16x1.5=24px</p> <section> <p id="em">14(直近の親要素サイズを参照)x1.5=21px</p> <p id="rem">16(root要素サイズを参照)x1.5=24px</p> </section> </p> </section> scss section{ font-size: 16px; p#em{font-size:…

visibility: hidden;...見た目は消えるが要素の描画領域は残る。空白スペースが残っているような物。 display: none;........見た目は消えるし、描画領域も無くなる。 html <ol> <li id="v-h">visibility: hidden</li> <li id="d-n">display: none;</li> <li>テスト</li> </ol> CSSなしの出力 visibility: hidden di…

(1)レイヤー>新規塗りつぶしレイヤー>グラデーションを選択 (2) グラデーションタイプ「ノイズ」を選択 カラーモデルを集中線のカラーに合わせる オプションに全てチェックを付ける (3)塗りつぶしダイアログボックスに戻り、「スタイル」を「角度」に設定「9…

(元となるオブジェクト) (拡大縮小するとオブジェクトの各パーツもそれに合わせて拡大縮小してしまう。)オブジェクトを拡大縮小するとオブジェクトを各形状(角丸の半径など）が変わってしまうのを「シンボル登録」することで形状を維持したままサイズを変え…

棒グラフでイラストアイコンを間延びさせる表現をillustratorのアートブラシを使用して表現する。 間延びするアイコンを用意する (1)アイコンを「新規ブラシ」から「アートブラシ」で登録する。 オプション設定 (2)「アートブラシオプション」 から「ガイド…

(1)下地となるカンバスサイズを後で割り切りやすいように、きりのいい数値で作成。 今回は600x600pxで作成。 カンバスの中央にパターンのオブジェクトを配置。 (2)フィルタ>メニュー>その他>スクロールを選択。 その際に「ラスタライズをしますか？」と出る…

ドロップダウンメニュー divのclass名にdropdownを付け、その中にある aタグでドロップダウンをメニューをホバー表示させる。 aタグにはclass="dropdown-toggle"とdata-toggle="dropdownを付与。 ドロップダウンメニューの表示はliとaタグで表示。 メニュー…

文字ツールでキャッチコピーなどで使用する文字を3Dで表現します。 文字をアウトライン化。 グループ解除して1文字ずつ配置分散させる。 効果メニュー > 3D > 押し出し・ベベルで3D化。 3D化が分かりやすく見えるように塗りと線の色のコントラストをはっきり…

イメージの図形 imgタグにクラス名img-図形名をつける。 <img src="http://placekitten.com/200/200" class="img-rounded"/> <img src="http://placekitten.com/200/200" class="img-circle"/> <img src="http://placekitten.com/200/200" class="img-thumbnail"/> 出力結果 イメージのレスポンシブ imgタグにクラス名img-responsiveを付け加える事でデバイスのサイズに沿った大きさになる。

ボタンのカラー buttonタグにクラス名btnをつける。 それに併せて用途に合わせたカラーリングのクラス名を付け加える。 <button type="button" class="btn">btn</button> <button type="button" class="btn btn-default">default</button> <button type="button" class="btn btn-primary">primary</button> <button type="button" class="btn btn-info">info</button>

基本のフォームコード inputのクラス名にform-control、id名にexampleInputをつける。 input直下のspanタグにつくクラス名ehelp-blockは入力フォームのヘルプテキスト。 <form> <fieldset> <legend>フォームタイトル</legend> <div class="form-group"> <label for="exampleInput">name</label> </div></fieldset></form>