在GOOGLE浏览器中模拟移动浏览器 调试Web app

在此记录下，以便在今后的工作中用到。

首先通过F12 or Ctrl+Shift+i，打开开发者工具，点击开发者工具面板的 (show  drawer)按钮，出现如下图所示的面板:

切换至Emulation选项卡中，在这里我们就可以自由地模拟各种各样的移动浏览器了，该功能支持了包括iPhone、ipad、google nexus系列等机型。

 

感兴趣的同学赶紧去试试吧。你会发现chrome是最好的web app开发利器。

 

温馨提示:需要在chorme 32版本后，才有些设置哦。

 

最后还给大家推荐一款好的可以替代dreamweaver的软件，它的名字叫:HBulider，个人很喜欢使用这款IDE工具，我使用的dreamweaver cs 6经常CPU高达20%多，感觉不爽。而使用HBuilder不会，最关键的是不比dreamweaver差，而且用起来舒服

在GOOGLE浏览器中模拟移动浏览器 调试Web app,布布扣,bubuko.com

时间： 2024-12-17 07:19:03

在GOOGLE浏览器中模拟移动浏览器 调试Web app的相关文章

让你在PC上调试Web App，UC浏览器发布开发者版

目前,在手机上使用浏览器访问网页,无法便捷地进行网页语言调试.手机屏幕相对较小且操作不便,直接在手机上进行网页数据调试不太现实. 因此,UC使用技术将手机网页调试信息分离,实现一种能在大屏幕.高配置PC上来调试小屏幕.低配置的手机浏览器访问的网页的开发工具--Remote Inspector(简称RI). 主要功能 Android平台UC浏览器开发者版,主要支持以下功能: DOM查看和修改 JavaScript调试.CSS调试 网络状态查看 资源文件查看 Console控制台 准备工作 手机端

在IE8等不支持placeholder属性的浏览器中模拟placeholder效果

placeholder是一个很有用的属性,可以提示用户在input框中输入正确的内容,但是IE8以及IE8一下的浏览器不支持该属性,我们可以使用js来模拟相似的效果.下面直接上代码: <!doctype html> <html> <header> <meta charset="utf-8"> <title>placeholder</title> <style type="text/css"

浏览器中模拟mouseenter omouseleave事件(解决onmouseover onmouseout重复调用)

一. mouseenter和mouseleave何时被触发 我们来看下官方解释(mouseenter,mouseleave): // onmouseenter:Fires when the user moves the mouse pointer inside the boundaries of an object.即:当鼠标移入元素对象的边界之内时,激活该事件 // onmouseleave:Fires when the user moves the mouse pointer outside

调试WEB APP多设备浏览器(转)

方法:adobe shadow  \ opera远程调试\ weinre adobe shadow: 我们经常使用Firefox的firebug或者Chrome的开发人员工具进行Web调试页面,JavaScript,DOM元素和CSS样式的调试.但是,当我们为移动Web站点或应用进行调试时,这些工具就很不方便,因为不知道在手机上或者pad看到的效果是怎样的? 解决方案一: adobe shadow 我们先来安装Adobe Edge Inspect CC 下载地址:https://creative

调试WEB APP多设备浏览器

方法:adobe shadow  \ opera远程调试\ weinre adobe shadow: 我们经常使用Firefox的firebug或者Chrome的开发人员工具进行Web调试页面,JavaScript,DOM元素和CSS样式的调试.但是,当我们为移动Web站点或应用进行调试时,这些工具就很不方便,因为不知道在手机上或者pad看到的效果是怎样的? 解决方案一: adobe shadow 我们先来安装Adobe Edge Inspect CC 下载地址:https://creative

为什么eclipse中启动tomcat后，浏览器中出现404?

问题描述: tomcat压缩包加压后,启动lib文件夹下面的startup.bat,在浏览器中输入http://localhost:8080/后出现熟悉的界面. 但是在eclipse中,jsp可以正常运行,然而在浏览器中输入http://localhost:8080/后,出现404界面,在网上搜了不少. 最终解决了,一个小小的问题分享一下. 启动startup.bat出现的界面: 在浏览器中输入:http://localhost:8080/ 出现下面界面: 但是在jsp中启动tomcat,在浏览

远程调试 Azure Web App

当我们将 Web App 部署在 Azure 上时,如果能够实现远程调试,将会极大的提高我们修复 bug 的效率.Visual Studio 一贯以功能强大.易用著称,当然可以实现基于 Azure 应用的创建.发布和调试.接下来就让我们一起看看如何使用 Visual Studio 远程调试部署在 Azure 上的 Web App,以及一些常见的注意事项. 文章来源:葡萄城产品技术社区 注意工具的版本 在开始正文前让我们先检查一下使用的 Azure SDK 版本和 Visual Studio 版本

JavaScript------&gt;调试JavaScript代码------&gt;使用 浏览器 中的 “开发者工具” 来调试

1.如何打开浏览器中的"开发者工具" *360安全浏览器 *方法一,打开想要调试的网页如index.html,浏览器右上角---工具----开发人员工具 *方法二,直接按快捷键F12即可打开浏览器中的开发者工具 2.使用浏览器中的"开发者工具" 2.1使用开发人员工具中的console面板 console面板概述: 该面板内可以输入JavaScript代码 按回车后,直接执行JavaScript代码 1)console.log(<变量>);//回车后显示

如何在浏览器中执行调试Sencha Touch源代码

用.NET开发习惯了,每次想在浏览器中查看效果,只会在Visual studio中用右键--在浏览器中浏览的方式执行. Sencha touch遇到的问题必须要在IIS网站中修改MINI类型和处理程序映射.而visual studio2012中浏览会默认用IIS express,导致无法调试.而用修改VS使调试时用本地IIS也是有问题的. 幸好sencha cmd本身自带web服务器,执行步骤如下: 运行--cmd--cd 调试程序index.html所在目录--sencha web start