移動前端 - 收藏集 - 掘金

Sticky Footer，完美的絕對底部 - 前端 - 掘金
寫在前面 作過網頁開發的同窗想必都遇到過這樣尷尬的排版問題：在主體內容不足夠多或者未徹底加載出來以前，就會致使出現（圖一）的這種狀況，緣由是由於沒有足夠的垂直空間使得頁腳推到瀏覽器窗口最底部。可是，咱們指望的效果是頁腳應該一...

[【科普文】二維碼的[生成]和[掃碼] - 掘金](https://juejin.im/post/58eb05...
做者：孫輝，美團金融前端團隊成員。15年畢業加入美團，相信技術，更相信技術只是大千世界裏知識的一種，我的博客: https://sunyuhui.com 最近這段時間，團隊在作的業務主要和二維碼相關，在作的過程當中，發現不論是本身仍是團隊裏其餘同窗，都對二維碼...

css sprite雪碧圖製做，使用以及相關，圖文gif。 - 掘金
寫在前面： 在網頁製做中，雪碧圖也是前端攻城獅必須掌握的一項小技能。百度詞條對雪碧圖的解釋是：CSS雪碧 即CSS Sprite，也有人叫它CSS精靈，是一種CSS圖像合併技術，該方法是將小圖標和背景圖像合併到一張圖片上，而後利用css的背景定位來顯示須要顯示...

標籤欄圖標，隨機背景圖，壓縮背景 - 掘金
寫在前面：本文內容見標題，以前github我的主頁每次看到地址欄旁邊的小圖標默認的樣子，都以爲醜爆了，前幾天終於抽空把這個改了，還有以前背景圖片用了一個大壁紙的網址連接，每次讀取背景的時候感受要半天那麼久，一直想着要弄個反應速度快的！而後我又找到一個好方法。 ...

翻屏類 h5 適配方案：解決寬高自適應難題 - 前端 - 掘金
基於淘寶適配方案flexible + 翻屏h5 適配方案adaptive flexible解讀及應用 原文: http://www.w3cplus....

移動端 H5 頁面注意事項 - 掘金

1. 單個頁面內容不能過多 設計經常使用尺寸：750 x 1334 / 640 x 1134，包含了手機頂部信號欄的高度。 移動端H5活動頁面經常須要可以分享到各類社交App中，經常使用的有 微信、QQ 等。 使用移動設備查看頁面時會發現，在微信瀏覽器中有 頂部導航欄...

有效解決 css sprite 圖片使用 rem 單位邊角缺失的問題 - 前端 - 掘金
原由 在移動端使用 rem 佈局時 sprite 圖片也須要用 rem 單位。但因爲瀏覽器對小數單位精度解析的差別，在不一樣設備上一些圖片看起來會缺了一點點，或者多了一點點.....

【0 基礎學習微信小程序】4. 模塊化與 page 函數 - 前端 - 掘金
本文爲菜鳥窩編輯吳佳林的連載。 菜鳥窩是專業的程序猿在線學習平臺，提供最系統的 Android 項目實戰課程 微信小程序0基礎入門 ...

改造你的網站，變身 PWA - 掘金
最近有不少關於 Progressive Web Apps（PWAs）的消息，不少人都在問這是否是（移動）web 的將來。我不想陷入native app 和 PWA 的紛爭，可是有一件事是肯定的 --- PWA極大的提高了移動端表現，改善了用戶體驗。 好消息是...

移動 web 1px 邊框解決方案 - 掘金
在移動端web頁面開發中，爲了使css中使用的尺寸與設計稿一致，一般會採用 rem 單位配合 lib-flexible 來實現移動端的適配，在IOS設備上 flexible.js 會根據設備的分辨率動態的調整 viewport 的 width 和 scale ...

談談前端人員在項目中的正確溝通方式 - 掘金
做爲一個有點想法的web前端從業人員，是從業人員，在項目中不免會跟不一樣的角色打交道。有讓本身舒服的，也有讓本身難受的；有讓別人舒服的，固然，也有讓別人難受的。咱們固然但願最好的結果是你們都很舒舒服服地把事情作完作好。這便就是本文要探討的地方。 項目中的角...

Android可伸縮佈局－FlexboxLayout(支持RecyclerView集成) - 掘金
1 . 前言 前幾天看到Google官方的博客介紹了Google開源的一個強大的佈局－FlexboxLayout，看見第一眼我內心的想法是，臥槽，Android 竟然有這麼一個強大的佈局。做爲一個有好奇心的工程獅，固然第一時間就去試了試手，效果很是贊，所以這...

新年第一發 -- 深刻不淺出 zepto 的 Tap 擊穿問題 - 前端 - 掘金
問題來源 年前去阿里面試，過程當中說道了fastclick解決iPhone機器上300ms點擊延遲的問題，而後就被問到了zepto的「點擊穿透」的現象以及產生這個具體緣由，當時回答的不是很好，主要是沒有特別深刻的去研究這個緣由，只是知道有這個現象和問題，...

完美解決 fixed 在手機端的 bug - 前端 - 掘金
1、帶input的fixed在ios下失效 在ios下，一個頁面若是有fixed浮層，而且浮層裏面有input，那麼當input focused的時候，fiexed層的位置就會錯亂。 ...

移動端實踐 - video - 前端 - 掘金
提及video，相信你們並不陌生。對於作過視頻方面的小夥伴，特指前端方面的小夥伴，對它更是愛恨交加。由於，video使咱們很方便在移動端播放視頻，沒必要像PC端那樣須要安裝一個flash。 video很複雜嗎？不，它很簡單。要想使...

響應式和自適應的區別 - 前端 - 掘金
玩前端也有幾個月了，發現你們廣泛混淆了響應式和自適應的概念。先給你們體驗一下響應式和自適應的區別，請放大縮小一下屏幕嘗試 自適應的體驗http://m.ctrip.com/html5/&nbs... 響應式的體驗 http://segmen...

自適應設計與響應式網頁設計 - 前端 - 掘金
目前很是流行自適應設計與響應式設計，並且常常讓人混淆，自適應設計不該與自適應佈局混爲一談，它們是徹底不同的概念。 在這先說明下這二者的異同： 自從移動終端飛速發展以來，各類各樣的機型日新月異，不少網站的解決方法，是爲不一樣的設備提供不一樣的網頁，好比專門...

手機端頁面自適應解決方案—rem 佈局進階版（附源碼示例） - 前端 - 掘金
一年前筆者寫了一篇 《手機端頁面自適應解決方案—rem佈局》，意外受到不少朋友的關注和喜歡。但隨着時間的推移，該方案已然過期，故爲你們介紹一個目前我極力推薦使用的，更加完美的方案——rem佈局（進階版） ...

延遲加載 (Lazyload) 三種實現方式 - 前端 - 掘金
定義：延遲加載也稱爲惰性加載，即在長網頁中延遲加載圖像。用戶滾動到它們以前，視口外的圖像不會加載。這與圖像預加載相反，在長網頁上使用延遲加載將使網頁加載更快。在某些狀況下，它還能夠幫助減小服務器負載。 舉個例子來講明，當打開淘寶首頁的時候，只有在瀏覽器窗口裏的...

封裝並實現統一的圖片加載架構 - 掘金
前言 對於圖片加載框架，你們用到的多是Glide，Picasso或者Fresco，這基本上是主流的圖片加載框架，咱們使用它的時候，大都感受如臂使指，簡直愉快的不要不要的。可是咱們仍是發現至少有兩個問題，以Glide爲例，第一，當需求變更，你須要對圖片加載失敗...

設計無限滾動下拉加載，實踐高性能頁面真諦 - 掘金
UX Planet論壇上有過這麼一篇熱門文章: Infinite Scrolling Best Practices，它從UX角度分析了無限滾動加載的設計實踐。 無限滾動加載在互聯網上處處都有應用：豆瓣首頁是一個，Facebook的Timeline是一個，Twe...

「前端」rem 縮放方案 flexible-js 兼容 375px 方案的思路 - 掘金本文來自尚妝前端團隊南洋 發表於尚妝github博客，歡迎訂閱。 移動端H5頁面rem縮放方案flexible.js兼容375px方案的思路 參考： 移動端高清、多屏適配方案 viewport-and-flexible.js flexible.js git...