在我们用phoengap+html5做的移动app中,经常遇到的问题就是 本地网页兼容但是到了app出现不兼容的情况,原因是手机端页面,大多运行在webkit内核的浏览器上,但还是会因平台.厂商的不同而有种种兼容性问题. 下面就介绍一下在iOS和Android两个平台上如何在真机上对页面进行调试.这里要说明的是,iOS平台只能用自带的Safari浏览器来调试,而Android平台也只能用google Chrome浏览器来调试.当然,我目前只发现这么两种手段,如果你还有其他方法可调试更多的浏览器,…

方法1: ionic run android -l -c 将会在console中输出日志信息 方法2: (1).使用usb连接android设备,并打开android设备的调试功能 (2).在chrome浏览器的地址栏中输入 chrome://inspect/#devices,此时会在浏览器中看到连接的设备 (3).点击chrome页面上的inspect按钮,将会弹出开发者模式窗口,可以看到应用程序的日志信息. 如图: 注:如果出现空白页面,可翻 墙后再试试.…

(function(){ var print={ lock:true, log:function(param){ if(this.lock){ var element=document.createElement("div"); element.style.background='green' element.style.fontSize='20px' switch (typeof param){ case "string" :element.innerHTML=p…

2007 年 W3C (万维网联盟)立项 HTML5,直至 2014 年 10 月底,这个长达八年的规范终于正式封稿. 过去这些年,HTML5 颠覆了 PC 互联网的格局,优化了移动互联网的体验,接下来,HTML5 将颠覆原生 App 世界.这听起来有点危言耸听,但若认真分析 HTML5 的发展史,你会发现,这个世界的发展趋势确实就是这样. 熟知历史才能预知未来,先让我们来看看 HTML5 为什么诞生.这 8 年是怎么过来的. 一. HTML5 的诞生 自 W3C 于 1999 年发布 HTML…

你的网页内容在移动设备上的体验可能和电脑上完全不同.Chrome DevTools 提供了远程调试功能,这让你可以在安卓设备上实时调试开发的内容. 安卓远程调试支持: 在浏览器选项卡中调试网站. 在原生安卓应用中调试网页内容. 将屏幕从你的安卓设备上投影到你的开发机器上. 使用端口转发和虚拟主机映射来让安卓设备访问开发使用的服务器. 需求 要开始远程调试,你需要: 安装 Chrome 32 或者之后的版本. 连接安卓设备用的 USB 线缆. 对于通过浏览器调试:安卓 4.0 以上并且安装了 Ch…

最早开始调试移动端网页时,本人都是采取PC上改几行代码,手机上刷新一下看效果这种笨方法来开发的,效率低而且容易让人抓狂.最近偶然发现原来可以使用PC上的浏览器来调试移动设备,不由得感叹相逢恨晚. 工具: Chrome浏览器(PC) Chrome Dev浏览器(移动设备) 步骤: 在移动设备上安装Chrome Dev浏览器,可以在软件市场找到,安装完成后用该浏览器打开需要调试的网页 在Chrome(PC)上输入chrome://inspect/ 将移动设备通过USB与PC连接,期间会出现授权,是否…

我在每天工作中需要在不同的移动设备上测试我们开发的前端应用是否正常工作,比如iOS设备和Android设备.我用的工作笔记本电脑又是Lenovo的,安装的是Windows操作系统. 有的时候一个开发好的前端应用,在Android设备上正常工作,但是在iOS平板上测试却发现问题(相当广大前端开发者都曾经遇到过类似问题).顺手就想调试一下找到原因.那么一个前端应用运行在iOS设备上,程序员如何在安装了Windows系统的笔记本上进行调试呢? 假设我的前端应用是这个url:https://jerryl…

XE6 & IOS开发之免证书真机调试(1):颁发属于自己的App签名证书(有图有真相) XE6 & IOS开发之免证书真机调试(2):连接真机并运行App(有图有真相) XE6 & IOS开发之免证书真机调试(3):生成iPA文件并安装到其它苹果设备上(有图有真相) XE8 & IOS开发之免费证书真机调试:开发证书.AppID.开发授权profile的申请,附Debug真机调试演示(XCode7 Beta版或以上版本适用,有图有真相)…

网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 1.既然我们已经在真机上运行过App了,那么现在就来生成一下.--------------------------------------------------------------- 1.在虚拟机下,点一下桌面(星空图随便某个地方),在Finder中选择'前往','应用程序'. 2.找到'iTunes',双击运行.…

平时写代码,最喜欢用chrome的developer Tool调试页面了,基本是离不了的工具.但是当页面需要在移动设备上使用,尤其是被嵌入到Hybird APP中时,由于移动版的chrome没有developer Tool,只能傻傻的用alert来输出一些调试信息,修改了CSS样式也必须不断的刷新,文件多了有时候还得经常清缓存,效率极其低下.神啊,救救我吧! 于是weinre出现了!它是一个基于nodejs的工具.可以把远程的页面运行情况映射到本地,在本地的浏览器中查看调试信息,修改的css样式…

本文转自迅为论坛:http://www.topeetboard.com 1.安装ADB驱动 在开发板上调试 Android 应用,首先要安装 ADB 驱动. 通过“SDK Manager.exe”来安装.如下图所示.另外需要注意的是,如果要使用 SDK Manager 安装软件,需要将 Eclipse 关闭. 安装完成后,打开文件夹中“USB_fastboot_tool\platform-tools”的命令行 cmd.exe, 如下图所示,输入命令“#adb”,然后回车.这里集成了 adb 命令…

最近在看响应式网站的开发视频,其中有一部分非常有用,就是在多个设备上进行网页调试,通过使用browser-sync来实现,具体的步骤可以参照官网(http://www.browsersync.cn/) 按照步骤操作就可以了,当然电脑必须安装了node.js,在这里我主要说一下我遇到的问题,就是在调试网页的时候发现所监听的网页不会出现在浏览器中,有以下两个原因: 1:在启动browser-sync的时候要将你所监控的文件路径以及文件用双引号括起来,不可以用单引号 2:你自己写的html必须命名为"…

网上的帖子很多,但很多都是老版本的,试过了,根本不管用,花了一天时间,终于在本机试验通过了,特记录下来,以备用.有需要的朋友也可以参考.先上一张图,看看PC端chrome上调试的效果: 左边是手机的模拟操作器,右边是大家熟悉的开发人员工具,也可以在手机上操作,PC端左边屏幕会同步到手机上的界面. 下面再说一下环境配置: 1.手机端,我手机是华为荣耀4,android4.4.4,很旧的手机了,大家别笑话,但不影响本次试验.安装chrome版本为58.0.3029.83: 2.PC端,win7 64…

在设备上进行安装 在 Google Android 设备上安装应用程序 在 Apple iOS 设备上安装应用程序 在 Google Android 设备上安装应用程序 在项目的开发.测试和部署阶段,可以将应用程序直接安装在设备上. 您可以使用 Flash Builder 直接在 Android 设备上安装应用程序.当您在未安装 Adobe AIR 的设备上安装包时,Flash Builder 会自动安装 Adobe AIR. Adobe 建议 有要分享的教程?   文章和视频教程:对 Goog…

需求:开发一个metro应用,因为要给平面设计师参谋, 需要将软件安装在win8平板上. 环境:开发机是win8,  win8平板是win8.1rtm , 是用老的win7平板改装的. 步骤: 1:拷贝开发机中C:\Program Files\Microsoft Visual Studio 11.0\Common7\IDE\Remote Debugger到平板任意目录. 本人在此之前,先是按照提示下载微软的调试工具, 却发现在平板上安装不上,后来直接拷贝了上述文件. 2:记录下平板上的管理账号和…

在做Win10开发的时候,我们可能经常会需要获得当前程序在在哪个平台设备上运行,用于UI和相关API的调用,那么可以通过什么方式知道当前APP运行的平台呢? 今天这里提供两个方法给大家做参考: 方法一:DeviceFamily 通过Windows.System.Profile.AnalyticsInfo.VersionInfo.DeviceFamily,来获取当前的平台设备,目前只可以得到两个值Windows.Mobile或Windows.Desktop,分别代表手机和pc(平板) (当然以后没…

转载:http://www.ibm.com/developerworks/cn/linux/embed/embdev/index.html   如果您刚接触嵌入式开发,那么大量可用的引导装载程序(bootloader).规模缩小的分发版(distribution).文件系统和 GUI 看起来可能太多了.但是这些丰富的选项实际上是一种恩赐,允许您调整开发或用户环境以完全符合您的需要.对 Linux 嵌入式开发的概述将帮助您理解所有这些选项. 3 评论: Anand K Santhanam, 软件工…

HTML5的设计目的是为了在移动设备上支持多媒体…

要在通过 USB 连接的设备上使用 adb,您必须在设备的系统设置中启用 USB 调试(位于开发者选项下). 在搭载 Android 4.2 及更高版本的设备上,“开发者选项”屏幕默认情况下处于隐藏状态.如需将其显示出来,请依次转到设置 > 关于手机,然后点按版本号七次.返回上一屏幕,在底部可以找到开发者选项. 在某些设备上,“开发者选项”屏幕所在的位置或命名方式可能有所不同.…

由于在开发板上 LEDtest 应用已经默认安装了,所以在开发板上调试已安装应用的时候,需要做一下处理才能够正常连接.基于迅为iTOP4418开发板如下图所示,在打开工程“ledtest”,打开“bin”→“res”→“AndroidMainIFest.xml”文件,选择“Mainifest”.将 Package 的名称“com.topeet.ledtest”改为“com.topeet.leddebug”.‘’ 如果想修改应用图标名称和应用程序窗口名称,则将下面的两个红色框中的参数修改成下图对应…

​ 1.使用云调试剩余优惠时长还剩300分钟,但还会扣费的情况. 问题描述:用户的云调试账户显示剩余优惠时长还有300分钟,但在使用云调试的过程中,还是产生了扣费的情况. ​ 解决方案: 当开发者成功注册华为开发者联盟后,华为会以帐号为维度每日零点为开发者提供一定的优惠时长,开发者帐号下的所有项目共用该优惠时长.优惠时长只适用于部分机型,可享受优惠时长机型会在机型图标旁边展示"惠"标识.在开通了付费档,按量付费后吗,如果使用了非优惠的机型,就会产生付费的情况. 该问题可以参考的文档如下…

在iPhone系列和iPod Touch中使用的是Safari浏览器,它支持前面介绍的媒体查询表达式.例如,使用iPhone 320px×480px的分辨率去访问我们前面的布局示例,却无法得到我们想看到的结果,并不是从上到下排列显示,而是和计算机显示器访问的布局相同.为什么会这样?因为在iPhone中使用的Safari浏览器在进行页面显示时是将窗口的宽度作为980px进行显示的,因为很多网页是按照800px左右标准制作的,所以Safari浏览器默认按照980px的宽度进行显示,就可以正常显示绝大…

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css"…

方式1: html5sql官方网址:http://html5sql.com/ 阅读之前,先看W3C关于WEB Database的一段话: Beware. This specification is no longer in active maintenance and the Web Applications Working Group does not intend to maintain it further. 意味着WEB Database规范陷入僵局. html5sql官方网址:http…

一.简介 我们要做的是怎样一款游戏? 在前不久成都TGC2016展会上,我们开发了一款<火影忍者手游>的体感游戏,主要模拟手游章节<九尾袭来 >,用户化身四代,与九尾进行对决,吸引了大量玩家参与. 表面上看,这款游戏与其它体感体验无异,实际上,它一直运行于浏览器Chrome下,也就是说,我们只需要掌握前端相应技术,就可以开发基于Kinect的网页体感游戏.   二.实现原理 实现思路是什么? 使用H5开发基于Kinect的体感游戏,其实工作原理很简单,由Kinect采集到玩家及环境…

在用HTML5开发手机应用或手机网页时,<head>部分总会有如下一段代码,这段代码到底什么意思呢.在网上,大家会得到很多答案.我从网上搜集了部分介绍,整理一下,以留备用. <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" /> 什么是Viewp…

正所谓“工欲善其事,必先利其器”,对Web开发人员来说,好工具的使用总会给人带来事半功倍的效果.正准备学习HTML5或者已经进行了一段时间的HTML5开发的童鞋,都有必要了解下,HTML5都有哪些开发工具,哪款开发工具更适合我?下面就一一盘点下: 一.HTML5全栈开发工具之Adobe Dreamweaver 首先是大名鼎鼎的Adobe Dreamweaver,Adobe Dreamweaver 软件使设计人员和开发人员能充满自信地构建基于标准的网站.由于同新的 Adobe CS Live 在线…

网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,苹果发布Xcode7后, 开放了普通的AppleID也能真机调试:( 非$99 或 $299, 只要能上AppStore下载应用的AppleID就行) 真机调试的开发测试环境: 虚拟机版本: VMware11+unlock203 RAD平台:XE8up1  (下载地址及和谐手段请看QQ群:165232328 的不看后…

Fiddler是一个免费的Web调试代理,支持任何浏览器.系统以及平台.这个工具是进行Web和App网络开发的必备工具,戳此处下载. 根据Fiddler官网的描述,具有以下六大特点: Web调试 性能测试 HTTP/HTTPS流量记录 Web会话处理 安全测试 自定义扩展性 本文讨论的主要内容是如何设置Fiddler,使PC和移动设备上可以抓取HTTPS数据包. 首先,在菜单栏选择Tools->FiddlerOptions,切换到Connections选项卡 第二步,勾选允许远程连接,并设置一个…

让网页的宽度自适应屏幕<meta name="viewport" content="width=device-width"/>   1)html上加入<meta name="viewport" content=" initial-scale=1.0,user-scalable=no" />    发确保网页的效果       2)        加上以下语句可使网页在苹果设备上运行更好    <m…