QQ 空间接入宽屏。 (与腾讯微博分属两个不同平台)

相关文档: 

流动应用画布说明

前端页面规范

多区多服场景说明

应用宽屏根据游戏分为两种。 

1: 普通游戏,但想要实现宽屏显示。

2: 多区多服的游戏,平台默认实现宽屏模式。 见 多区多服场景说明 。

关于页面宽度规格:

1. 多区多服应用自动支持从选取页面进入应用时的全屏模式。
2. 非多区多服应用可以自行选择如下2种宽度模式中的1种,二者只能选其一,应用上线前上线后都可以重新选择:

模式一:开发者可以指定一个应用的固定宽度,该宽度的范围为760px-950px之间的任意整数值。如果不指定则默认为760px。
指定该固定宽度后,应用的宽度即固定为指定的值,应用上线前上线后都可以调整该固定值。
指定宽度的方式为:
登录open.qq.com后进入管理中心,在“应用管理”tab的“平台信息”页面,填写应用宽度。

模式二:开发者可以选择应用宽度为自适应模式,则应用内容将根据用户屏幕宽度进行自适应显示,在760px-950px之间进行自适应调整。
指定自适应模式的方式为:登录open.qq.com后进入管理中心,在“应用管理”tab的“平台信息”页面,选择“自适应”。
注意:
应用如果选择了自适应模式,则必须自己在应用内先实现宽度自适应。

这里介绍普通游戏的宽屏实现。

1. 什么是流动应用画布?

流动应用画布(Fluid Canvas)是指应用画布可以随着用户浏览器窗口的宽度自由延展。应用画布将占满用户浏览器窗口中非平台运营区的全部空间,并随着用户窗口大小的变化而扩大或缩小。
应用如果支持宽度自适应,就可以最大限度的利用用户浏览器的窗口空间,提供更好的宽屏体验。

注意:
该特性目前仅支持QQ空间和腾讯朋友平台上的已上线应用。

(1)用户浏览器宽度大于1280px时:
应用画布宽度 = 950px (注:平台为了后续扩展,预留了一些宽度buffer,测试的时候大于950也许可以显示,但超过950可能导致将来画面被截断)
其它要素宽度为:
空间动态条宽度:45px;平台运营区宽度:180px;两侧间距宽度:动态变化 (2)当应用浏览器窗口宽度在(1024, 1280]px区间内时:
应用画布宽度:在[760,950]之间动态变化(注:平台为了后续扩展,预留了一些宽度buffer,测试的时候大于950也许可以显示,但超过950可能导致将来画面被截断)
其它要素宽度为:
空间动态条宽度:45px;平台运营区宽度:180px;两侧间距宽度:动态变化 (3)当应用浏览器窗口宽度小于或等于1024时:
应用画布宽度 = 760px
其它要素宽度为:
空间动态条宽度:45px;平台运营区宽度以及两侧间距宽度:动态变化

具体情况效果见 流动应用画布说明

  

腾讯QQ空间应用宽屏接入的更多相关文章

  1. 腾讯QQ空间超分辨率技术TSR

    腾讯QQ空间超分辨率技术TSR:为用户节省3/4流量,处理效果和速度超谷歌RAISR 雷锋网AI科技评论: 随着移动端屏幕分辨率越来越高,甚至像iPhone更有所谓的“视网膜屏”,人们对高清图片的诉求 ...

  2. jQuery插件实现图片展开效果,jquery.gallery。仿腾讯QQ空间说说图片展示效果。

    公司的项目http://www.umfun.com/,有个说说的页面(和腾讯QQ空间说说一样),里面有个发表图片功能,上传完图片,需要点击展开的效果. 当时手里面事情比较多(公司就我一个前端),忙不过 ...

  3. 腾讯QQ空间穿越时光轴3D特效

    <DOCTYPE html> <html> <head> <title>腾讯QQ空间穿越光轴3D特效</title> <style&g ...

  4. iPad开发--QQ空间,处理横竖屏布局,实现子控件中的代理

    一.主界面横竖屏效果图 二.主界面加载, 初始化Dock(红色框的控件),判断程序启动时的屏幕方向.调用自己- (void)transitionToLandScape:(BOOL)isLandScap ...

  5. 然并卵,腾讯QQ认证空间又再次关闭申请

    昨天发布的腾讯QQ认证空间又开放申请的消息,此消息一放出,大家都去关注认证的事情,而马浩周发现在4月27日下午4-5点,腾讯QQ空间认证又再次关闭页面开放申请的通知,变成了以前停止审核的通知了. 可能 ...

  6. TOP100summit:【分享实录-QQ空间】10亿级直播背后的技术优化

    本篇文章内容来自2016年TOP100summit QQ空间客户端研发总监王辉的案例分享.编辑:Cynthia 王辉:腾讯SNG社交平台部研发总监.腾讯QQ空间移动客户端技术负责人高级工程师.09年起 ...

  7. 【腾讯bugly干货】QQ空间直播秒开优化实践

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址为:http://bugly.qq.com/bbs/forum.php?mod=viewthread&tid=1204&am ...

  8. 腾讯QQ认证空间4月27日已全面开放申请,欲进军自媒体

    今天看到卢松松的博客上爆出,腾讯QQ认证空间4月27日已全面开放申请的消息,这一消息出来, 马浩周根据提示方法进行申请,下面先说说腾讯QQ认证空间的申请方法: QQ认证空间开放申请公告地址:http: ...

  9. 分享到QQ空间、新浪微博、腾讯微博的代码

    今天公司原来的分享代码,在IE下有问题.网上找了下网上的分享代码. 给网页加上分享代码,借助网友的力量推广网站,目前已经很流行了 以下是网页代码 QQ空间分享代码如下: <a href=&quo ...

随机推荐

  1. mappedBy的作用

    mappedBy的意思就是"被映射",即mappedBy这方不用管关联关系,关联关系交给另一方处理 1.规律:凡是双向关联,mapped必设,因为根本都没必要在2个表中都存在一个外 ...

  2. HDU 2352 Verdis Quo

    罗马数字转化为十进制的值 题目非常的长 提取有效信息 并且介绍很多规则 但是事实上有用的信息就是如何加 什么时候减 当当前字母小于下一个字母时 减去当前字母的值 #include <iostre ...

  3. 哀悼改变全站颜色为灰色CSS代码收藏

    <style type="text/css">   *{       filter:progid:DXImageTransform.Microsoft.BasicIma ...

  4. "格式太旧或是类型库无效。 (异常来自 HRESULT:0x80028019 (TYPE_E_UNSUPFORMAT))"

    错误提示内容: “System.Runtime.InteropServices.COMException (0x80028019): 格式太旧或是类型库无效. (异常来自 HRESULT:0x8002 ...

  5. [Bash] Move and Copy Files and Folders with Bash

    In this lesson we’ll learn how to move and rename files (mv) and copy (cp) them. Move index.html to ...

  6. payload和formData有什么不同?

    最近做项目的时候,在通过post请求向服务端发送数据的时候,请求失败了.错误信息如下: 返回的400(bad request)错误,说明客户端这边发送的请求是有问题的. 和通过jquery中的ajax ...

  7. poj1904 二分图匹配+强连通分量

    http://poj.org/problem?id=1904 Description Once upon a time there lived a king and he had N sons. An ...

  8. 自己定义控件 播放GIF动画

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/ ...

  9. Unity Critter地图导出到server配置

    普通情况下,从Critter导出的地图会与Unity自带的Navigation洪培出的地图会有比較大的差异.须要耐心调整Critter的參数才干够. 以下是我调的參数,与Unity导出的地图基本相似. ...

  10. Visual Studio 2017中使用正则修改部分内容 如何使用ILAsm与ILDasm修改.Net exe(dll)文件 C#学习-图解教程(1):格式化数字字符串 小程序开发之图片转Base64(C#、.Net) jquery遍历table为每一个单元格取值及赋值 。net加密解密相关方法 .net关于坐标之间一些简单操作

    Visual Studio 2017中使用正则修改部分内容   最近在项目中想实现一个小工具,需要根据类的属性<summary>的内容加上相应的[Description]特性,需要实现的效 ...