随笔分类 - 移动开发(WAP,Android,IOS)
摘要:https://gold.xitu.io/entry/586483de8d6d81006506467b 腾讯移动Web前端知识库 最全前端资源汇集 http://www.jianshu.com/p/c3dae0951f74 2013年初接触移动端,简单做下总结,首先了解下移动web带来的问题 设备更
阅读全文
摘要:包括内容: css初始化、css全局设置、常用meat标签、rem适配、flex布局、相关技巧(手势库使用、多行截字、1像素边线、点击状态、placeholder居中等) reset 引用 normalize.css css全局设置 包括字体、行高、默认webkit浏览器属性重置 meta标签(禁用
阅读全文
摘要:目录 图片 布局 音频视频 编辑器 轮播图 弹出层 表单 存储 动画 时间 其它 CDN 图片 baguetteBox.js - 是一个简单易用的响应式图像灯箱效果脚本。demo Lightgallery.js - 是一个功能齐全的JavaScript图像灯箱插件。demo viewerjs - 是
阅读全文
摘要:/* core.css v1.1 | MIT License | corecss.io */ html { font-family: sans-serif; font-size: 100%; line-height: 1; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -we...
阅读全文
摘要:原文:http://www.verydemo.com/demo_c143_i23854.html 我们在 multifile 中可以很容易的发现如何使用,这里就简单说说了,首先在页面上我们需要有这样几行标签代码 然后在该页面中引入相关的JS和CSS 然后通过js和设置刚刚写入的标签 当然,上面的这段
阅读全文
摘要:构建你的结构体系 CSS预处理器的特点之一是可以把你的代码分割成很多个文件,而且不会影响性能。这都要归功于Sass的@import命令,只要在你的开发环境下,你调用不管多少文件,最终将编译出一个CSS样式文件。 多个文件中开发,最终合并输出一个文件。——@Bruce Lee 开始将你的CSS文件分割
阅读全文
摘要:为什么我们的媒体查询需要去改变 我们现在使用的媒体查询一般来说都是基于目前流行手机设备的屏幕分辨率。 首先,当Web设计社区开始不断地关注响应式Web设计时, 流行的手机设备要数 iPhone 和 Android 智能手机了。 好,闲话不多说,现在就开始,应用于手机设备上的媒体查询从概念上看就好像是
阅读全文
摘要:Respond.js 第一种方案也是最简单的一种——我现在谈到的是一个脚本叫respond.js,是可以增强老版本浏览器理解和执行CSS3的媒体查询。添加如下代码就可以使用它。 <script type="text/javascript" src="js/respond.min.js"></scri
阅读全文
摘要:MVC的本质就是在controller中完成业务逻辑,并对model进行修改,同时model的改变引起view的自动更新 function Model(value) { this._value = typeof value === 'undefined' ? '' : value; this._li
阅读全文
摘要:CSS架构 有趣的是,我们通常不这样评判其他语言。一个Rails开发者不会因为他写的代码规范就认为他是一个好的开发者。因为这是最基本的。当然它必须是满 足规范,除此以外还要考虑其他方面:代码是否有可读性?他是否容易修改或是拓展?他是否跟程序的其他部分解耦合?他是否可以扩展? 当评估代码其他部分时这些
阅读全文
摘要:iPad Media Queries 1、iPad Media Queries (所有版本,包括iPad mini) iPads从第一代到至今,总共有五代,也就是iPad1~iPad5,以及Mini iPad。而且每一代iPad都具有相应的CSS Media Queries。这些代码能让你在的代码在
阅读全文
摘要:最近一项 研究表明,80%的网民对移动端的浏览体验感到失望,同时,当体验提升时,他们会在智能手机上花费更多的时间。 这不奇怪,因为64%的智能手机用户希望网站可以在4秒内加载完毕,但一半的网站花费了二倍以上的时间,达到了9秒。这篇文章会阐述一些可以使你的网站在移动端跑得更快的技术。 移动端用户的下载
阅读全文
摘要:曾几何时为了兼容IE低版本浏览器而头痛,以为到Mobile时代可以跟这些麻烦说拜拜。可没想到到了移动时代,为了处理各终端的适配而乱了手脚。对于混迹各社区的偶,时常发现大家拿手机淘宝的H5页面做讨论——手淘的H5页面是如何实现多终端的适配? 那么趁此Amfe阿里无线前端团队双11技术连载之际,用一个实
阅读全文
摘要:ouchBox原文:https://github.com/maxzhang/touchbox移动端单页视图库,适用于制作移动专题DEMOhttp://jsbin.com/vatuma/latest手机扫描下面二维码查看例子:使用方法首先,页面必须是下面的结构 // ... ...
阅读全文
摘要:兼容篇兼容篇是我最想写的一部分,在这之前也总结过很多关于移动开发的兼容问题与解决方案。对于移动Web开发来说,兼容是开发重心,通常要花费30%甚至更多的时间去处理一些兼容问题,甚至时间花掉了,问题依然无法解决。相比PC Web开发,移动开发的兼容性需要考虑的问题更复杂,我自己花了一个图:图13在上图...
阅读全文
摘要:交互篇从PC到移动端,视觉和交互是用户能直接感受到的差异。在视觉篇中已经提到,移动设备的物理属性一部分影响到视觉,另外一些部分将影响到交互。那么,移动设备影响交互的物理属性都有哪些变化呢?对于这个问题,相信大家都早有答案。传统PC的输入设备相对单一,一般情况下只有鼠标和键盘,而移动设备的硬件就变得非...
阅读全文
摘要:视觉篇智能移动设备由于发展历史短,但更新速度快,从而导致移动设备的物理属性差异巨大,其中一部分物理属性影响视觉,另一部分影响到交互、兼容或性能。对人类来说,至少有80%以上的外界信息通过视觉获得,视觉是人和动物最重要的感觉,所以,咱们从视觉开始说起。看一个案例:访问m.3600.com首页,首页焦点...
阅读全文
摘要:Update:Unfortunately this does not 100% solve the problem, the script falls down when handling touch interactions when a scrolling section is bouncing...
阅读全文
摘要:dragloader.js是一个面向移动Web开发的JavaScript库,帮助开发者在使用页面原生滚动时,模拟上/下拉手势,实现Pull Request操作。在移动设备上,一般会使用 drag down 手势实现加载最新使用 drag up 手势实现加载更多dragloader样例需运行在 Sma...
阅读全文
摘要:在单页应用开发中,无论是页面结构化,还是Pull to Request,都离不开一个技术——页面局部滚动。当下的移动web技术,主要使用下面两种方式实现局部区域的滚动:基于IScroll组件,也有很多团队自己实现类似的组件,实现原理大都一样。使用浏览器原生支持overflow: scroll,在iO...
阅读全文