1.前端流程:
1)需求分析
2)原型圖(低保真)——產品經理/設計師/策劃繪製
3)做效果圖
4)**實現
4)360瀏覽器歡迎頁面
3.若要用html5+css3做全屏(效果圖設計)
1)一般寬為1366px,如果是1920的解析度,則讓寬度自適應;高度一般做成768px或者700px
2)在ps或者fireworks新建畫布(寬度1366px,高度700px,解析度72,顏色模式rgb,背景白色)——》最上面1366*60px的導航(一般高度給定60,具體看原型圖)——》在導航上擺放logo(如果暫時沒有logo,可以直接敲字型「logo」或者其他能表明意思的內容)和字型——》選中項或者當前項給定乙個背景色(繪製乙個矩形)——》放入原型圖中的字型內容——》用矩形做button按鈕(此時放入所有的內容到設計圖裡面)
3)找到logo,進行替換——》如果沒有透明背景的logo,則要做處理——》導航字型處理為20px(具體視情況而定)——》字型為「微軟雅黑」
4)設定導航上面字型的間距:在前兩個之間敲入合適的空格——》雙擊選中空格——》複製空格到其他的導航字型之間
5)圖層分組——》頁面填充背景色——》新建圖層,做背景的漸變處理——》合併圖層,轉為智慧型物件(在ps中右擊)——》濾鏡——》畫素化/晶格化(具體視情況而定)——》編輯濾鏡(智慧型濾鏡可以編輯,普通圖層物件是沒法修改的)——》蒙版處理(使得濾鏡效果柔和)——》字型居中對齊
4.扁平化的好處:
1)效率高(適應不同的解析度)
2)便於修改
3)便於**編寫
5.關於數字的處理:
10000.00這種寫法的視覺衝擊力要比1萬強很多。(當然,如果是商品打折的這種情況則反之,具體視不同的情況,會有不同的視覺效果)
6.網際網路設計分類:(來自傳智)
7.滾滾屏的特點:
1)沒有縱向的滾動條
2)一般為全屏切換
3)通過滑鼠滾輪進行切換
4)每個螢幕都有切入和切出動畫(也可理解為淡入和淡出)
5)每個螢幕中都有可以互動的元素
8.滑鼠滾輪事件捕獲外掛程式:
滑鼠滾動事件的寫法:
執行效果:(檢視控制台console)9.mousewheel方法的兩個引數:
10.注意:滑鼠滾輪滾動的時候,往下是-1,往上是1
11.if語句死鎖問題:
執行效果:如何解決這個問題呢?
執行效果:12.標準流中的盒子(塊級元素),如果不寫寬度,則寬度預設為父盒子的100%;如果脫離了標準流,則不再具備該特點。
脫離標準流的幾種方式:
1)position:absolute;
2)position:fixed;
3)float:left;
13.緩衝:
引用jquery.easie.js,並且新增下圖選中內容:
14.函式節流
函式節流,簡單地講,就是讓乙個函式無法在很短的時間間隔內連續呼叫,只有當上一次函式執行後過了你規定的時間間隔,才能進行下一次該函式的呼叫。
(參考部落格:
函式節流的解決辦法就是:設定定時器
15.fireworks用來做切片比較方便
用fireworks開啟psd檔案的時候,選擇「維持photoshop層外觀」——》開啟psd檔案——》複製圖層——》新建——》貼上——》匯出
16.色塊滾滾屏:
html執行效果:(滾動到第二個頁面)>
lang=
"en">
class=
"container">
class=
"page page0">
0class=
"page page1">
1class=
"page page2">
2class=
"page page3">
3class=
"page page4">
4
執行效果:
滾 滾 滾動條(移動端 二)
好的,現在更第二篇。先是點選事件莫名的點選一次然後竟然觸發了兩次,對沒錯,是兩次。頭皮都撓完了才發現問題,莫名的傷心 先是嘗試了點選新增事件,然後再解綁事件。結果還是不行。某位大神跟我說去看原始碼。最後強忍著牙進入原始碼,一番折騰知道一般情況下很多框架裡面其實都會 寫乙個重新整理的函式,這樣子問題就...
MFC縱向滾動條
1.新建乙個edit control,將其multiline屬性設定為true,auto hscroll屬性設定false,這樣就可以實現每一行填滿後自動換行了。2.再將vetrical scroll屬性設定為true,當輸入或顯示超過編輯框的大小後就會出現垂直滾動條。這乙個我並沒有試驗 3.如果是...
DIV實現縱向滾動條
overflow y scroll的使用 1.首先設定固定div的寬高 1.首先設定固定div的寬高 如果設定overflow auto 表示當你內容超過div高度出現滾動條 overflow語法如下 overflow visible auto hidden scroll 引數 visible 不剪...