PCゲーマーのWebデザイン備忘録

PCゲーマーのWebデザイン備忘録。東京都内でWEBデザイナーとして働いています。Webデザインやゲームに関することをブログに書いていきます

2014-09-28から1日間の記事一覧

【Illustrator】 複合パスとクリッピングマスクでドットモザイク風の写真を作る

複合パスとクリッピングマスクで、ドットモザイク風の写真を作ります。 楕円ツールを使い、以下のような感じにドットを並べる。 並べたドットだけを選択し、「オブジェクト」から「複合パス」 全部選択して「オブジェクト」から「クリッピングマスク」「作成…

【Illustrator】 ライブトレースを使って、イラスト風の処理をする

ライブトレース(画像トレース)を利用して、画像をイラスト風にします。やり方 「ファイル」から「配置」で画像を置く 「ウィンドウ」から「画像トレース」を選択 各パラメーターをいじる。このときプレビューを切るとスムーズに編集ができる

【JavaScript】サムネイルを押すと、その画像に切り替える画像一覧

サムネイルにマウスポンタをのせるとと、下の大きな画像を切り替える画像一覧をつくります。 name属性を使い下の画像だけを変える画像の置換の方法は前回の記事の方法を使います。大きな画像の中にname属性を入れることで、imgタグに指定してある画像を切り…

【JavaScript】 イベントハイドラを使い、CSSを使わないで、画像置換を行う

イベントハンドラを使うことで、CSSの擬似要素を使わずに画像置換を行います。 イベントハンドラの書き方 <img src="#.png" alt="" on...="'JavaScript'"> 「on...」はhtmlの要素で、onmouseoverやonclickなどがあり、その要素にJavaScriptを設定して書き込むことができます。 インハンドラで画像置換を行…