一直想找個鍛煉自己的機會，但是又很恐慌，怕自己能力太差，把握不住機會，把事情弄糟。

終于，要做wap問答系統(tǒng)了，本來說是幾個人一塊兒做，我分析了下頁面，發(fā)現(xiàn)共同的部分還是比較多的，有點想法，要不我接過來做做，看布局不是很難，但自己也沒有很大把握，一直在猶豫，糾結(jié)。

終于鼓起勇氣，提出我來做，雖然底氣不足，但我還是說出來了。產(chǎn)品讓我估時間，瞬間有點慌，幾乎沒做過什么項目，做的頁面也不多，我實在不知道自己多長時間能完成。我支支吾吾的，大概著想6天？頁面又有些重復(fù)，要不5天，再加點緊，4天？于是，很沒底氣的跟產(chǎn)品說，四五天吧~“怎么可能？最多到下周一！”產(chǎn)品的一句話把我驚到了。當(dāng)時是周三下午4點多，算起來也就3天多一點吧。我咬咬牙:“行！交給我吧！實在做不完，我就加班。”可能我堅決的態(tài)度有點反常，產(chǎn)品驚訝了！

這些頁面，看起來不難，很多布局都一樣，可我卻花了不少時間，走了不少彎路。

平面設(shè)計培訓(xùn),網(wǎng)頁設(shè)計培訓(xùn),美工培訓(xùn),游戲開發(fā),動畫培訓(xùn)

這里有幾個層切換，我就想模仿之前同事寫的，寫層滑動的效果。給外部層設(shè)置400%的寬度，overflow:hidden，里面每個層25%，當(dāng)點擊分類的時候，使用translateX來滑動外部層。這個效果寫了很長時間，很費勁，寫不出來的時候，我竟然完全把別人的div布局和css樣式copy過來，這種做法很不好，自己不懂這樣做的原理，copy的時候很盲目，以后盡量少copy，不過這樣做之后，也算學(xué)會了這個布局。當(dāng)寫完這個效果的時候，竟然還沾沾自喜。哈哈~馬上，我就發(fā)現(xiàn)了問題，這個數(shù)據(jù)列表是需要下拉刷新，上拉加載效果的！我之前寫的布局完全不能用了~花了我那么長時間，抓狂?。?/p>

我從來沒寫過下拉刷新，上拉加載效果，這個需求也著實折磨了我一番。我選擇用mui來寫這個效果。查看mui官方文檔，借鑒同事寫過的頁面，先初始化mui的pullrefresh,然后再調(diào)用、傳參，拼拼湊湊，大概寫出了這個效果。但是，當(dāng)切換層的時候，該怎么處理呢？折騰了半天，我明白了，這個層切換不能用多個div的切換，下拉刷新，上拉加載需要在一個層里，當(dāng)切換層，要重新請求數(shù)據(jù)，清空mui-table-view，重新append數(shù)據(jù)。但是還有個問題，就是當(dāng)切換層的時候，怎么觸發(fā)mui下拉刷新從新請求數(shù)據(jù)。在官方文檔里找了半天，還是沒有解決這個問題。搞了一天，也是醉了~最后百度這個問題，輕而易舉找到了答案，如何觸發(fā)下拉刷新事件的代碼是：mui('.box').pullRefresh().pulldownLoading();mui的文檔好弱??！超級不好用！看來大家寫的blog還是很好的，哈哈！光這個層切換觸發(fā)mui刷新又折騰了一天(此時已經(jīng)周六過去了)。

平面設(shè)計培訓(xùn),網(wǎng)頁設(shè)計培訓(xùn),美工培訓(xùn),游戲開發(fā),動畫培訓(xùn)

首頁面還有一個橫向滑動，在mui下拉刷新的容器里，之前寫的普通的左右拖動層效果失效了。想著還用mui吧，百度了很多，終于找到了關(guān)鍵字“區(qū)域滾動-橫向滾動”，看官方文檔，加了些樣式，并不起作用~又在blog里找到了答案，初始化scroll事件，如下。還要注意這段代碼的位置，要放在下拉刷新調(diào)用的后面，具體原因不明~慚愧??！

平面設(shè)計培訓(xùn),網(wǎng)頁設(shè)計培訓(xùn),美工培訓(xùn),游戲開發(fā),動畫培訓(xùn)

//橫向滑動初始化mui($('.course-wrap')).scroll({
scrollX: true,
scrollY: false,
indicators: true,
de