原创 iPhone又出新機了,UI設計師該用什麼尺寸呢?

概述 iPhone這次一下出了三款新機,iPhone Xs、iPhone XR、iPhone Xs Max,那麼問題來了,這三款手機與之前的有什麼不同,設計師的UI尺寸會發生什麼變化,移動端頁面的UI到底應該以多少爲好?接下來我們將一

原创 微信小程序-template模板使用

如下圖,我在做華企商學院小程序的時候,課程搜索結果頁和課程列表頁結構是完全一樣的,這時就非常適合使用模板來完成頁面搭建。實現一次定義,到處使用。 模板 一、定義模板 1、新建一個template文件夾用來管理項目中所有的模板; 2

原创 Preload圖片預加載(jQuery插件)

背景 我們在做頁面的時候,從用戶體驗的角度出發,肯定是希望用戶以最快的速度看到完整的頁面信息,但在實際情況中經常會遇到些問題。 比如受網速影響,頁面加載素材的時間比較長,頁面會出現短時間的錯亂或者閃屏; 或者頁面素材比較多、比較大,需要一

原创 微信小程序-bindtap等事件傳參

什麼是事件 事件是視圖層到邏輯層的通訊方式。 事件可以將用戶的行爲反饋到邏輯層進行處理。 事件可以綁定在組件上,當達到觸發事件,就會執行邏輯層中對應的事件處理函數。 事件對象可以攜帶額外信息,如 id, dataset, to

原创 Vue.js系列之vue-router(下)(5)

說明: 我們項目現在用的是:vue2.0 + vue-cli + webpack + vue-router2.0 + vue-resource1.0.3 如果大家在實踐的過程中與本文所說的內容有較大區別的話看看是不是版本問題。 本文

原创 Web動畫形式

背景 對於Web開發者來說,不管什麼細分方向,比如數據可視化、網站系統、電商網站等等,都會涉及到一個難題“動畫”。 因爲動畫關係到Web開發的兩個比較重要的點,一是視覺效果,二是用戶體驗,通過酷炫動畫效果可以給視覺加不少分,同樣,恰到好

原创 Canvas星空效果(JS面向對象)

概述 更多Canvas實例可以看GitHub,不定時更新:https://github.com/xiangshuo1992/canvas-demo 這個Demo主要有以下幾點可以討論: 1.HTML5 canvas的基礎API,如

原创 Vue.js系列之vue-resource(6)

說明: 我們項目現在用的是:vue2.0 + vue-cli + webpack + vue-router2.0 + vue-resource1.0.3 如果大家在實踐的過程中與本文所說的內容有較大區別的話看看是不是版本問題。 本文

原创 微信小程序-scroll-view橫向滾動和上拉加載

今天介紹微信小程序中scroll-view實現橫向滾動和上拉加載的實現及需要注意的地方。 先看最終效果。 橫向滾動 1.設置滾動項display:inline-block; 2.設置滾動視圖容器white-space: nowrap

原创 微信小程序-navigator 跳轉url傳遞參數

使用方法說明 (1)傳值:在navigator的屬性url後拼接?id(參數名字)=要傳遞的值 (如果多個參數用&分開 &name=value&…….) (2)取值:options 是包含url地址中參數的對象,可以直接 點

原创 Vue.js系列之vue-router(上)(3)

說明: 我們項目現在用的是:vue2.0 + vue-cli + webpack + vue-router2.0 + vue-resource1.0.3  如果大家在實踐的過程中與本文所說的內容有較大區別的話看看是不是版本問題。 本文是一

原创 Canvas繪製時鐘(面向對象版)

概述 更多Canvas實例可以看GitHub,不定時更新:https://github.com/xiangshuo1992/canvas-demo 在學習了老師的課程之後,自己實現了一遍,同時寫了一個面向對象的版本。 Canvas時

原创 微信小程序-(cover-view/cover-image)

概述 在微信小程序經常會用到一些原生組件,比如map、video、canvas、camera,這些原生組件想讓其他元素覆蓋在其上,必須使用cover-view或者cover-image組件。最近在開發的小程序也是用到了camera這個組件

原创 單屏(全屏)適配解決方案(jQuery插件)

背景 在平時的web開發過程中,經常會要實現單屏或者叫全屏的效果,同時要滿足設備適配要求,雖然一些常見的插件能實現一定的效果,但是如果需要靈活運用的話還是會受到很多限制,在不斷的實踐過程中,我們梳理了一套全屏適配解決方案,能兼容IE8+,

原创 微信小程序-自定義button、checkbox組件

問題描述 微信小程序開發過程中,經常會存在需要自定義一些組件的情況,接下來我們介紹這次開發小程序我遇到的自定義button和checkbox。 自定義button 除了簡單的用view或者其他標籤模擬,加上背景圖片完全放飛自由,還有特定需