随着微信的越来越大众化，微信的使用程度也越来越高。随之，产生了一种新的推广模式，即微信推广。在这个微信的大平台上会衍生出许许多多的推广手段。而移动前端作为服务于手机用户的手机网页技术，也不可避免的加入进来。

一些客户不仅仅满足于自己的网站可以在手机浏览器上完美的展现出来，同时还要求可以在微信中进行广泛推广。这就要求移动前端的制作者在制作移动端网站的过程中，还要考虑是否兼容微信的推广。

就制作技术而言，如果可以完美的在手机浏览器中显示，那么在微信推广里也可以完美显示。因为微信中调用的网页引擎就是你手机支持的网页引擎。但在微信中显示的网页和在手机浏览器中显示的网页还是有一些细微的差别，这些细微的差别则决定了一些使用小技巧的可能。

微信对手机网页的支持不是百分之百的，它因为自身业务发展的需要，对网站中的a标签进行了二次封装定义。一些使用在a标签的js代码，在某些特定情况下不产生效果了。而有些a标签则莫名的产生了一些问题。

我举2个例子来说明：

例子1：<a href='tel:400-4000-0000' >XXX<

阅读(72) ┆ 评论(0) ┆ 转载(2) ┆ 收藏(0)
 

Sencha Touch是个重量级的框架，是基于extjs写的, 它的使用原理全是封装好的方法，包括页面布局和版块。全是js方法生成。换句话说HTML页面结构文档中之间是没有任何前端代码结构的。这个也算是该框架的一大特点吧。

该框架优点是兼容性很广，Android和IOS上都可以良好的运行。在布局上，手机、平板电脑都可以兼容。但其缺点也较明显。过于封闭，调试起来很麻烦。需要有相当水平的前端技术才能使用。上手较慢，另外，运行速度和流畅度上，同比于jquery mobile、jqmobi、jqtouch差了一些。前端水平一般者，不建议使用该框架！

这个框架我使用的不多。平时偶尔拿来练练手而已，没有实际太多的项目开发的使用经验，对该框架的使用程度而言，我只是停留在初级阶段，对它没有进行很深入的研究和学习。因此本文权当是该框架的入门文章。只对该框架的进行简单的介绍即可。想通过该篇文档对Sencha Touch框架的使用水平有质的飞跃的话,请选择专业的教程进行系统的学习，谢谢。

言归正传，下面对该框架进行简单的介绍，同时我已经认为你的电脑上已经下载了该框架的整体文件包了。以下为代码：
<!DOCTYPE html

阅读(302) ┆ 评论(3) ┆ 转载(3) ┆ 收藏(0)
 

随着移动前端的手机屏幕分辨率越来越多，自适应设计制作显得越来越重要。如何自适应屏高和屏宽是每个设计和制作人员共同需要考虑的事情。设计人员需要考虑N多分辨率的情况，而制作人员则需要考虑如何自适应布局等等。

我先从设计的角度来阐述这个问题，首先要考虑如何进行自适应设计。这个需要和制作人员进行沟通后决定，如果制作人员采用响应式布局（稍后会介绍此布局）的制作方案的话，则需要设计人员根据不同的屏宽来设计不同的效果图以便提供给制作人员进行响应式布局制作。如果制作人员采用高宽最大化（稍后会介绍此布局）来进行布局制作的话，则需要设计人员提供一个最合理的分辨率设计效果图来适应主流的所有分辨率屏幕的手机。

一、响应式布局

相应式布局的核心内容其实就是使用CSS3引入的Media Query模块。它的意思就是，自动探测屏幕宽度，然后加载相应的CSS文件。

　　&l

阅读(915) ┆ 评论(1) ┆ 转载(3) ┆ 收藏(1)
 
    移动前端框架有许多，这次简要的介绍jQTouch框架。jQTouch也是轻量级框架、它的语言基于jquery语言。上手容易。加载时间比较快，优点是动画切换很流畅、在Android和IOS上表现都不错。缺点是与其搭配的插件较少，需要一些外包插件来进行某些效果的支持,无法自定义布局样式等。

首先，我们先熟悉一下jQTouch的结构代码：

<!doctype html>
<html>
<head>
<meta charset='UTF-8' />
<title>jQTouch &beta;</title>
<style type='text/css' media='screen'>
@import 'css/jqtouch.css';
</style>
<script src='js/jquery-1.4.2.min.js' type='text/javascript' charset='utf-8'></script>
<script src='js/jqtouch.js' type='application/x-javascript' charset='utf-8'></script>
<script type='text/javascript' charset='utf-8'>
            var jQT = new $.jQTouch({

阅读(294) ┆ 评论(0) ┆ 转载(1) ┆ 收藏(0)
 

上文中，提到了许多的移动前端框架，这次主要介绍jqMobi框架。jqMobi也是轻量级框架、它的语言基于jquery语言。并对其进行了简化，更有利于在移动设备上进行应用，并且速度很流畅。上手很容易。

首先，我们要先部署jqMobi的环境，以下是代码：

<!DOCTYPE html><!--HTML5 doctype-->
<html>
<head>
<title>jqmobi精简版本</title>
<meta http-equiv='Content-type' content='text/html; charset=utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1'>
<meta name='apple-mobile-web-app-capable' content='yes' />
<META HTTP-EQUIV='Pragma' CONTENT='no-cache'>
<link rel='stylesheet' type='text/css' href='css/jq.ui.css' title='default'/>
<script type='text/javascript' charset='utf-8' src='js/jq.mobi.js'></script>
<script type='text/javascript' charset='utf-8' src='js/jq.debug.js'></script

阅读(841) ┆ 评论(5) ┆ 转载(1) ┆ 收藏(1)
 

为了更好的提升用户体验，移动端逐渐出了许多的移动端的框架，比如Sencha Touch、JQTouch、Jquery-moblie、jqMobi等等。这些框架都有优缺点，不同的框架应用在不同的项目中。现简单阐述一下各框架的优缺点：

一、Sencha Touch框架是一个重量级的框架、它上手较难，代码复杂，并且需要较强的程序基础才能学习，最开始的时候因为一个项目，想使用Sencha Touch框架，后来工期实在太紧张，根本没时间学习它并使用。所以最后转投其他框架。这个框架兼容性很高，运行起来的速度一般，需要长时间的学习且需要水平较高的程序基础才行。所以不太适合前端制作人员的使用。我会在以后的机会单开一篇关于它的使用demo。

二、JQTouch是一个轻量级框架、纯jquery写法，上手比较容易，代码容易理解，加载速度也很快，缺点是配合的移动端效果插件较少，需要很多外部的插件相结合，另外，个别插件还需要解决与框架之间的兼容问题。它的最大的一个弊端就是可利用和变通的布局较少。

三、Jquery-moblie也是一个轻量级框架、纯jquery写法，上手容

阅读(325) ┆ 评论(0) ┆ 转载(1) ┆ 收藏(0)
 

在互联网中，一般用户都是通过鼠标点击、鼠标悬停、鼠标离开等执行一些前端的事件，但是在移动前端，用户却是通过手指来进行操作。从而衍生出移动前端的手势事件。鼠标中的click事件虽然也可以在移动前端进行触发，但这个事件在移动端会有大约半秒中的延迟。所以一般都不采用。

在移动端的手势事件一般有四种情况：

touchstart:  手指放到屏幕上的时候触发
    touchmove:   手指在屏幕上移动的时候触发
    touchend:  手指从屏幕上拿起的时候触发 
    touchcancel:  系统取消touch事件的时候触发。

前三者应用很广泛，第四个应用较少。至今所做的项目中，第四项还没涉及过。如果有人用过，可以拿出来分享一下。

前三者可以看成是用户操作的一个过程。它们一般都是结合在一起使用。我举个360°旋转的例子，通过代码详细说明一下。

<!DOCTYPE html>
<html>
<meta charset='utf-8'/>
<meta name='viewport' content='width=48

阅读(338) ┆ 评论(1) ┆ 转载(1) ┆ 收藏(0)
 

javascript(简称js)语言在移动前端应用很广。可以说必不可少，许多效果都是和js相关的。包括现在移动端的一些框架。jqmobi、jqtouch、sencha touch、jquerymobile等等。这些都是基于js而进行编写的。这篇暂时不讨论这些框架。以后会慢慢介绍其中的一两个框架的具体使用方法。这篇主要讨论一下部分常用的js事件在移动端的使用。举几个例子：

1、隐藏地址导航栏：

<script type='text/javascript'>

// 该函数由Simon Willison编写,它只有一个参数,该参数表示被调用的函数名(在页面加载完毕时执行的函数的名字)
    function addLoadEvent(func) {
        var oldon1oad = window.on1oad;
        if (typeof window.on1oad != 'function') {
            window.on1oad = func;
        }
        else {
     &

阅读(400) ┆ 评论(2) ┆ 转载(1) ┆ 收藏(0)
 

上文的meta标签中，提到了部分功能要结合link标签进行使用。下面详细的解释一下移动端的link标签。link标签主要是存放CSS文件的地方，同时还有一些专属的移动端设置在这里体现。结合以下代码进行说明：

<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<meta name='viewport' content='width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no' />
<meta http-equiv='Cache-Control' content='no-store' />
<meta name='apple-mobile-web-app-status-bar-style' content='black'/>
<meta name='apple-mobile-web-app-capable' content='yes' />
<link rel='apple-touch-startup-image' href='images/start.jpg'/>

<link rel='apple-touch-icon' href='images/iphone.png' />
<link rel='apple-touch-icon' sizes='72x72' href='images/ipad.png' />
<link rel='apple-touch-icon' sizes='114x114' href='images/iphone4.png' />
<link rel='stylesheet' type='text

 

动端逐渐出了许多的移动端的框架，比如Sencha Touch、JQTouch、Jquery-moblie、jqMobi等等。这些框架都有优缺点，不同的框架应用在不同的项目中。现简单阐述一下各框架的优缺点：的更多相关文章

  1. Jwt在Java项目中的简单实际应用

    1.什么是jwt 双方之间传递安全信息的简洁的.URL安全的表述性声明规范.JWT作为一个开放的标准(RFC 7519),定义了一种简洁的,自包含的方法用于通信双方之间以Json对象的形式安全的传递信 ...

  2. Swift 项目中可能用到的第三方框架

    这里记录下swift开发中可能用的框架 , 最近浏览了不少,积累在这里,以后用的时候方便查阅.顺便推荐给大家! 这里的框架都是纯swift的 , 感谢开源 ,感谢大神们 . 下拉刷新 BreakOut ...

  3. android 项目中使用到的网络请求框架以及怎样配置好接口URL

    我们在做项目中一定少不了网络请求,如今非常多公司的网络请求这块好多都是使用一些比較好的开源框架,我项目中使用的是volley,如今讲讲一些volley主要的使用,假设想要具体的了解就要去看它的源代码了 ...

  4. python JoinableQueue在生产者消费者项目中的简单应用

    class multiprocessing.JoinableQueue([maxsize]) JoinableQueue, a Queue subclass, is a queue which add ...

  5. Web项目中创建简单的错误处理页面

    当应用程序出现错误的时候,如果没有做错误页面处理的话,会直接输出一些敏感的信息出来,有时候甚至会直接将项目所在的物理路径给显示出来,严重缺乏安全性,并且错误种类繁多,页面风格不一,导致用户体验不好,本 ...

  6. iconfont 在项目中的简单使用

    font-class引用 font-class是unicode使用方式的一种变种,主要是解决unicode书写不直观,语意不明确的问题. 与unicode使用方式相比,具有如下特点: 兼容性良好,支持 ...

  7. 分享一个集成在项目中的REST APIs文档框架swagger

    1 为什么是使用swagger? 1-1 当后台开发人员开发好接口,是不是还要重新书写一份接口文档提给前端人员,当然对于程序员最不喜欢的就是书写文档(当然文档是必须的,有利于项目的维护) 1-2 当后 ...

  8. Redis在SSM项目中的简单使用

    一.基于SSM的Redis环境配置 前提是你的开发电脑安装和配置好了redis,如果没安装请看Window配置Redis环境和简单使用 1.1.pom文件中引入redis客户端jar包(pom.xml ...

  9. Linux中ifreq 结构体分析和使用 及其在项目中的简单应用

    [基础知识说明] 结构原型: /* * Interface request structure used for socket * ioctl's.  All interface ioctl's mu ...

随机推荐

  1. windows 下的定时任务

    linux 下的定时任务是crontab 以前都是linux的定时任务,这次在windows做了定时任务,简单记录一下 windows 2008下的定时任务配置: 控制面板->管理工具-> ...

  2. 怎样创建FTP服务器

    怎样创建FTP服务器 2008-05-06 08:42永远的探索|分类:操作系统/系统故障| 浏览6382次 我准备用局域网内的一台机器做FTP服务器,创建FTP服务器一定要用Windows serv ...

  3. Sprint第一个冲刺（第九天）

    一.Sprint介绍 建立云端数据库,把注册的内容保存到云端,不易丢失. 实验截图: 任务进度: 二.Sprint周期 看板: 燃尽图:

  4. <script>标签应该放到</body>标签之前

    著作权归作者所有. 商业转载请联系作者获得授权,非商业转载请注明出处. 作者:贺师俊 链接:http://www.zhihu.com/question/20027966/answer/13727164 ...

  5. SocketTcpServer

    自定义SocketTcpServer,虽然现在有很多这样的组件,但是有时候还是需要把它集成在你的框架或者产品中,不需要特别强大的功能,根据需求定制.最基本的一个问题是判断数据包的结束,没有像super ...

  6. C#List转字符串，字符串转List，字符数组转Int数组

    List转字符串 [C#] 纯文本查看 复制代码 ? 01 02 List<string> List = new List<string>(); string strArray ...

  7. linux shell 使用总结

    为什么执行脚本要使用./ +脚本名来执行脚本理解:因为如果直接使用脚本名,那么linux 系统会去path 路径查找如去/bin usr/bin 等查找,这个时候会找不到这个脚本名字,就会报错.使用. ...

  8. AndroidImagePicker 的使用

    github地址 https://github.com/easonline/AndroidImagePicker 效果图

  9. How to Failover the ‘Cluster Group’

    If you have more than two nodes in the cluster, you can specify the destination node with the follow ...

  10. OneNote 2013 快捷键

    越来越喜欢onenote这个笔记本软件,找了下提高效率的办法,收藏学习下: 转载自:http://onenoter.com/2013/04/5792 记录笔记和设置笔记格式 键入和编辑笔记 操作 按键 ...