作者彙整: 姜智豪 老師

關於「姜智豪 老師」

於 1996 年開始從事網頁設計工作 20 多年，參與設計過許多網站專案的開發，一直熱衷網頁設計工作至今。從 1998 年開始從事教學工作，對於網頁設計教學有相當高的熱忱，於 2006 年創立飛肯設計學苑。主要專長 Photoashop、 HTML、CSS、RWD、JavaScript、jQuery 等網頁技術，對於 SEO 優化搜尋引擎排名提昇，以及 Instructional Design 教學專案設計亦有深入的研究。

【設計資源】 iPhone Design Guide 手機介面設計指南

這一份 PDF 文件有很詳細的列表，把各代 iPhone 手機的螢幕尺寸、解析度、畫面比例、畫面尺寸…等都以表格條列，可以讓我們有需要設計手機 APP 介面的設計師，或是有需要設計手機網頁畫面的設計師參考…. 閱讀全文 →

in Free Resource 好康報報, Good Design 好站報報

CSS 置中教學 – div 水平置中和垂直置中【一】

使用 CSS 語法要設定一個 div 水平置中，是很常見到的需求，最多人使用 margin: 0 auto; 這個方法就可以達成。但是，如果要讓一個 div 同時間做到在網頁上水平置中還要垂直置中，也就是 CSS 上下左右置中，這就有點麻煩了… 閱讀全文 →

in CSS 教學 - 網頁排版

jQuery 教學 – attr() 抓取圖片的屬性以及改變圖片的路徑

在 JavaScript 語法中，可以使用 document.getElementById(“MYIMG”).src 來抓取圖片的 src 路徑，然後改變圖片的 src 路徑，就可以製作出在網頁上變換圖片的功能。 到了 jQuery 語法，就改成了使用 $(“#MYIMG”).attr(“src”); 這個方法來抓取圖片的 src 路徑… 閱讀全文 →

in JavaScript 程式設計

jQuery 教學 – Animate 動畫練習 – 動態按鈕

當我們使用滑鼠觸摸到一個物件的時候，在 jQuery 語法可以使用 $(this) 指令來讓這個物件做出動畫效果，這一篇教學範例，我們要再加上 next() 指定下一個兄弟物件，還有 prev() 指定前一個兄弟物件，就可以讓前後的兩個物件也一起同時做出動畫 閱讀全文 →

in JavaScript 程式設計

jQuery 教學 – Animate 動畫 – 滑動式彩帶按鈕

這一個範例要讓同學來練習使用 jQuery 的 animate() 指令，設計製作動態滑動的按鈕，由於 jQuery 的 animate() 指令是借用 CSS 的語法來設定動畫效果，將原本靜態的網頁，變成具有動畫效果的呈現，所以在學習 jQuery 之前必須要先對 CSS 網頁排版熟悉，才能自由發揮出 jQuery 的各種動態功能… 閱讀全文 →

in JavaScript 程式設計

Photoshop 去背入門：菜鳥練功專用 – 使用套索工具鍛練去背基本功

Photoshop 的去背方法百百種，從簡單的魔術棒工具、快速選取工具、還有路徑工具、色版 Alpha Channel …等，針對不同的照片狀況就需要選用適當的方法來去背，其中，最基本的，用來鍛練身體的工具就是套索工具… 閱讀全文 →

in Photoshop 影像設計