十一 01

移动端UC /QQ 浏览器的部分私有Meta 属性

现在做WEB开发(不仅限于移动开发),都要考虑响应式布局与各种移动设备的显示效果等,国内的移动设备浏览器主要是UC浏览器和QQ浏览器为主(内核均为wekit内核),那么开发人员就必须知道一些它们的Meta私有属性,以更好的完成效果。文末有UC/QQ浏览器开发文档链接。

UC 浏览器的部分私有Meta 属性

设置屏幕方向为横屏还是竖屏

<meta name="screen-orientation" content="portrait|landscape">

设置是否全屏,yes表示强制浏览器全屏

<meta name="full-screen" content="yes">

缩放不出滚动条

<meta name="viewport" content="uc-fitscreen=no|yes"/>

设置no后用户缩放与标准浏览器缩放一直,设置为yes后,用户缩放金放到图片和文字,不出现横向滚动条。

排版

<meta name="layoutmode" content="fitscreen|standard" />

fitscreen模式简化页面处理,适合页面阅读节省流量,standard模式和标准浏览器一致;一旦设置layoutmode meta后,用户使用浏览器提供的的排版模式选项将会无效。

夜间模式

<meta name="nightmode" content="enable|disable"/>

nightmode的值设置为disable后,即使用户使用浏览器的夜间模式,页面的表现也仍然是非夜间模式。

强制图片显示

<meta name="imagemode" content="force"/>

UC浏览器为了节省流量,为用户提供了无图模式,但是如果页面的图片是必不可少的,如验证码的,需要强制浏览器显示图片,可以设置imagemode, 不影响子页面。通过META设置图片加载方式会作用于整个页面,如果希望对单个图片进行设置,那么可以使用这个

<img src="..." show="force">

应用模式

<meta name="browsermode" content="application"/>
使用了application这种应用模式后,页面讲默认全屏,禁止长按菜单,禁止收拾,标准排版,以及强制图片显示。

QQ 浏览器x5内核Meta私有属性

设置屏幕方向

<meta name="x5-orientation" content="portrait|landscape" />

设置全屏

<meta name="x5-fullscreen" content="true" />

设置屏幕模式

普通浏览模式:

<meta name="x5-page-mode" content="default" />

网页应用模式:

<meta name="x5-page-mode" content="app" />

对比

在Jeff 的实际使用的情况下,发现对于控制全屏的meta 标签,UC 跟QQ 处理的方式稍有不同:区别在于处理系统状态栏,UC 是直接覆盖系统状态栏,而QQ 仍然保留之。从原生应用的场景及用户角度看,QQ 的这种“伪全屏”反而是更为友好。

Continue reading

31

JS函数输出与获取多个返回值(实例)

16

微信支付 V3版

请一定要先看demo

需要申请相应的帐号
后台设置支付目录

js_api_call.php

 

16

PC、移动设备 页面上滚动态加载数据

页面向上滚动到底部后动态加载数据,或者说是页面上拉到达底部后自动加载内容,省去了访客手动点击“下一页”的动作,实为现在所讲的页面人性化设计理念。

像某些网站的瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多

还有,使用手机进入qq空间,向上拉动空间,页面到底部时,会动态加载剩余的说说或者是日志

今天我们就来看看他们的实现思路和js控制动态加载的代码

下面的代码主要是控制滚动条下拉(即页面上滚)时的加载事件的

在下面代码说明处,写上操作即可,无论是加载图片还是加载记录数据  都可以

别忘了引用jquery类库 Continue reading

14

WordPress网站提示:Cannot modify header information – headers already sent by出错的原因

WordPress网站提示:Cannot modify header information – headers already sent by出错的原因,就我个人的网站来说,问题是出在之前改过一个文件,我把保存格式改为了utf-8了,因为我回想一下我没改过什么东西,把文件改回来还是不行,后来在网上找来找去,发现可能是文件保存格式问题,转换了一下动过的文件的文件格式,转换为utf-8无MOB格式,好了。

QQ20151014152151

所以,如果碰到这个问题的朋友,可以试着回想一下动过了哪些文件,之后使用notepad ++编辑工具或者其它专业工具查看文件格式是不是utf-8无MOB格式,如果不是就转换过来,最好不用记事本工具。

http://mrdede.com

07

JS pageX、clientX、screenX、offsetX、layerX、x

chrome:

e.pageX——相对整个页面的坐标
e.layerX——相对当前坐标系的border左上角开始的坐标
e.offsetX——相对当前坐标系的border左上角开始的坐标
e.clientX——相对可视区域的坐标
e.x——相对可视区域的坐标

ff:

e.pageX——相对整个页面的坐标
e.layerX——相对当前坐标系的border左上角开始的坐标
e.offsetX——无
e.clientX——相对可视区域的坐标
e.x——无 Continue reading

31

CSS滚动条样式,火狐无效

效果不好,自己改。

另有滚动条插件,没有下载测试。链接 >> 狂点

据说,用法是这个样子的,在PHP100看到的,如下:

 

30

Opacity透明度属性IE浏览器及其它浏览器兼容方法

 

29

常用jQuery方法分类汇总(待续)

jQuery减少了代码的书写量,为前端开发节省了很多时间。有关于JavaScript常用函数请看这里 JavaScript常用函数收集

一、jQuery添加移除CSS类的方法

1 . addClass() – 添加CSS类

$(“#target”).addClass(“newClass”);

//#target 指的是需要添加样式的元素的ID

//newClass 指的是CSS类的名称

2 . removeClass() – 移除CSS类

$(“#target”).removeClass(“oldClass”);

//#target 指的是需要移除CSS类的元素的ID

//oldClass 指的是CSS类的名称

3 . toggleClass() – 添加或者移除CSS类:如果CSS类已经存在,它将被移除;相反,如果CSS类不存在,它将被加上。

$(“#target”).toggleClass(“newClass”);

//如果ID为“target”的元素已经定义了CSS样式,它将被移除;

//反之,CSS类”newClass“将被赋给该ID。

jQuery还提供用来判断某个元素是否已经被赋予某个CSS类的方法,如下:

1 . hasClass()方法是用来检查被选择的元素是否包含指定的class名,其语法:

$(selector).hasClass(“className”);//其中class是必须的值,规定需要在指定元素中查找的类名。

hasClass()也可以同时写多个class但他们之前用空格隔开,如下:

$(selector).hasClass(“className1 className2″);

2 . is()方法也是用来检查被选择的元素是否包含指定的class名,其用法为:

$(selector).is(“.className”);

同样is()也可以有多个类名的写法,如下:

$(selector).is(“.className,.className”);

hasClass()方法与is()方法有同各功能,但hasClass()方法的用时较短,所以说hasClass()方法在性能上是优于is()方法的。
Continue reading

29

织梦系统会员登录成功后返回之前来路页面

在使用织梦内容管理系统时,为使网站能有更好的用户体验度,我们都会对其进行功能方面的修改。那么会员登录成功后,返回到会员来到登录页面的前一页面的这个功能怎么修改呢?如下:

查找 文件member/templets/login.htm

第68行<input type="hidden" name="gourl" value="<?php if(!empty($gourl)) echo $gourl;?>">

改为<input type="hidden" name="gourl" value="<?php if(!empty($_SERVER['HTTP_REFERER'])) echo $_SERVER['HTTP_REFERER'];?>">