关于在Safari浏览器中将网页添加到主屏幕的相关设置（自定义图标，启动动画，自定义名称）

在ios中我们可以使用Safari浏览自带的将网页添加到主屏幕上,让我们的web页面看起来像native那样第一步: 第二步: 第三步: 到这里还没结束:我们还要进行相关设置才能使我们的应用更像原生的app 自定义图标和app名称在你的index.htm里面加上如下代码  <meta name="application-name" content="百度一下">  &…

iPhone 收藏网址[添加到书签] 和 [添加到主屏幕] 显示自定义图标,而不是网页截图

iPhone 收藏网址[添加到书签] 和 [添加到主屏幕] 显示自定义图标,而不是网页截图:  <link rel="shortcut icon" href="static/my/img/favicon.ico">  <link rel="apple-touch-icon" href="stat…

IOS 通过界面图标启动Web应用 + 全屏应用 + 添加到主屏幕

请注意!!!使用了[全屏模式之后].页面的顶部会空出一大块.而且这并不属于margin,padding,或者定位.就是单纯的空出来非常难调试.其实坑就是这里在 iPhone「添加到主屏幕」时显示自定义图标测试资源下载:https://github.com/dragon8github/mobile-boilerplate/tree/master/img/touch <!doctype html> <html> <head> <meta charset="…

利用iOS中Safari浏览器创建伪Web App

在safari浏览器里有一个“添加到主屏幕”选项,我们可以用来创建伪Web App,下面来了解一下iOS中Safari的私有属性第一步设置Web App的主屏幕图标: 有两种属性值apple-touch-icon和apple-touch-icon-precomposed,区别就在于是否会应用iOS中自动给图标添加的那层高光. <link rel="apple-touch-icon-precomposed" sizes="57x57" href="i…

当把链接保存到手机桌面。设置图标只在safari浏览器中有用

ios 使用Safari浏览器跳转打开、唤醒app

常常使用Safari浏览器浏览网页点击url会唤醒该站点的手机版app 须要在app的project中设置 1.打开project中的myapp-Info.plist文件 2.打开文件里新增URL TYPES的一项.详细例如以下图所看到的: 3.在project中实现例如以下方法 - (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url { if (url) { UIAlertView *alertVi…

如何在ios手机端的Safari浏览器中“查看网页源代码”

在这里给大家分享一个很简单的用苹果手机无需越狱就可以查看网页源代码的方法,不过这个方法只用于苹果手机自带的Safari浏览器随便添加一个safari 书签 (用于一会改为查看源码功能书签)进入书签点击编辑后选择第一步好的书签.更改书签标题随意(我改成查看源代码简单明了- -),下面网址改成 javascript:(function(){var w=window.open("about:blank"),d=w.document;d.write("<!DOCTYP…

mac的safari浏览器调试ios手机网页

iOS 6给Safari带来了远程的Web检查器工具. 一.参考链接 ios开发者文档 safari开发者工具 remote debugging safari 二.设置iphone 设置 -> Safari -> 高级 -> 开启web检查器三.设置mac Safari -> 偏好设置 -> 高级 -> 勾选显示开发菜单四.连接手机和电脑 1.用数据线,mac转接头把iphone和mac连接起来:2.打开iphone的Safari浏览器中需要调试的网页:3.打开ma…

用mac的safari浏览器调试ios手机的网页

safari浏览器click事件要点击两次才有响应出现闪烁

闪烁问题由于在iOS Safari上click事件存在300ms响应延时,所以为touch事件添加样式,会和click事件默认样式叠加而产生闪烁问题. 因为ios safari浏览器中对触摸事件的响应顺序是: ontouchstart -> ontouchmove -> ontouchend -> (300ms) onclick 快速解决问题的方法: 消除click默认样式通过讲click事件样式的alpha通道设置为0(透明),消除click事件的闪烁效果 -webkit-tap-…

【Sublime Text】sublime修改默认浏览器及使用不同浏览器打开网页的快捷键设置

#第一步:安装SideBarEnhancements插件下载插件,需要“翻墙”,故提供一下该插件的github地址:https://github.com/titoBouzout/SideBarEnhancements/ 1.在Sublime Text按下ctrl+shift+P打开命令面板,输入pcip,点击第一个,安装控制包.如图: 2.搜索“SideBarEnhancements”,选中,回车,及开始安装: #第二步:配置默认浏览器和打开网页快捷键 1.设置默认浏览器在打开的配置文件中,…

iOS 如何使用Safari浏览器打开app

1.首先在info.plist添加一个键值对,如下图或 2.在appdelegate.m文件如下方法写代码 -(BOOL)application:(UIApplication*)app openURL:(NSURL*)url options:(NSDictionary<NSString*,id>*)options{ if (url) { UIAlertView *alertView = [[ UIAlertView alloc] initWithTitle:nil message:@&quo…

CSS3-给网页添加图片

给网页添加图片: 1.background-attachment: scroll--------随文本一块滚动 ; background-attachment: fixed-----固定在一个位置上 2.background-size不支持IE8 background-size: width height; background-size: contain;/*迫使图片进行尺寸调整,保持图片的长宽比*/ background-size: cover;/*宽高调整,适应元素,所以经常变形*/ ba…

Safari浏览器Session问题

Safari浏览器中经常出现session无法写入或同一个会话中Session ID常变动的事情.尤其以iOS7版本居多. 问题本身并不难猜,应该就是cookie无法写入引起的.奇怪的是,部分同版本的Safari又是可以写入session的,所以这个问题很让人困惑. 反复查找,最后明白原因是:首先,对于第三方cookie,Safari升级后确实有禁止写入cookie的特性:其次,但是对于已存在cookie的情况,则尽管是第三方cookie依然还会写入.就是因为这些因素存在,所以之前进行测试的一些…

HTML&CSS基础学习笔记1.28-给网页添加一个css样式

CSS是什么? 当HTML配合CSS一起使用时,我们发现页面变得好看了很多.那么CSS到底是什么呢? CSS指层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML标签在浏览器内的显示样式,如文字大小.颜色.字体加粗等. 我们可以这么说,CSS是网页的衣服,它可以用来装饰网页. 那么接下来我们就来试试css吧~ 给网页添加一个CSS样式尝试给<p>标签直接加了一个[style]属性,并且给标签添加了一个字体颜色.这种在标签上直接添加样式的形式,我们称这种关联方…

手机浏览器wap网页点击链接触发颜色区块的问题解决办法

引子在做HTML5 WAP网页的时候,一行内容做了2个链接,点击一个标签的时候,整个颜色块会闪一下,影响美观.需求针对这种情况来问我,能否把这个一闪的颜色去掉.我当时就想,这个怎么去?那我也不好直接回绝她,好吧,我试试吧!经过研究,百度的很多a标签都是一闪一闪的,有颜色块,但是淘宝和京东的手机端就没有这种情况,这是如何做到的呢? 研究通过研究他们的代码发现,在根属性中,他们设置了这样的一个属性-webkit-tap-highlight-color:rgba(0,0,0,0). 下面解释一下什…

【学习】苹果iPhone safari浏览器样式重置修复按钮圆角bug

iPhone safari浏览器中,input按钮会按苹果的默认UI来渲染,例如,写的按钮明明是这个样的: 但是实际就会是这个样子: 怎么办呢? 为按钮添加:-webkit-appearance: none; 即可解决!…

Google Chrome谷歌/火狐/Safari浏览器开发者工具基本使用教程

前言在阅读下面内容之前,那么些简单的了解浏览器开发者工具到底是什么东西,到底有什么用途. 浏览器开发者工具到底是什么? 其实简单的说,浏览器开发者工具就是给专业的web应用和网站开发人员使用的工具,当然只要你有兴趣想要了解,只要你对这个世界充满这好奇,什么东西你都可以了解. 开发者工具到底有什么用? 它的作用在于,帮助开发人员对网页进行布局,比如HTML+CSS,帮助前端工程师更好的调试脚本(JavaScript.jQuery)之类的,还可以使用工具查看网页加载过程,获取网页请求(这个过程也叫…

iOS中Safari浏览器select下拉列表文字太长被截断的处理方法

网页中的select下拉列表,文字太长的话在iOS的Safari浏览器里会被自动截断,显示成下面这种: 安卓版的浏览器则没有这个问题. 如何让下拉列表中的文字在iOS的Safari浏览器里显示完整呢?答案是使用<optgroup></optgroup>标签.有关optgroup标签的作用可以查看w3school网站的说明. 正常select下拉列表的html是这样: <select id="sel_model" class="form-contr…

iphone手机safari浏览器访问网站滚动条不显示问题解决办法

近排有公司同事出差在外需使用OA系统,发现iphone手机safari浏览器在该出现滚动条的页面没有显示滚动条,导致无法正常使用. 系统前端页面是采用jeasyui搭建的框架,使用iframe变更主页.于是,在iframe外层包一层div,添加样式:style="-webkit-overflow-scrolling:touch;overflow:auto;". it works!…

解决苹果手机Safari浏览器下字体显示为蓝色的问题

解决苹果手机 Safari浏览器下字体显示为蓝色的问题近期测试同学测试,wap站上,底部文字在苹果8上面 ,使用 Safari浏览器打开,一直显示蓝色字体其他正常,寻找半天无解,最后阳仔小伙伴猛然想起来,这是不兼容,少了一句meta标签在 head区域添加上这句话即可 ,正常显示字体颜色了 <meta name="format-detection" content="telephone=no">…

javascript解决在safari浏览器中使用history.back()返回上一页后页面不会刷新的问题

我们知道,在JavaScript中提供了一个window.history.back()方法用于返回上一页,另外也可以使用window.history.go(-1)返回上一页(跳转). 在其他的主流浏览器中(Chrome.Firefox等),使用这两个方法都会重新执行返回页面的JS. 这就意味着,当文档加载完成事件函数中有刷新页面的操作代码的情况下,上一个页面会刷新. 但是在Safari浏览器中则情况有一些不同. 在实际测试中,在移动端中Android设备都会刷新,但是在IOS设备的Safari浏…

阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页

问题:ios封装完之后,点击里边的按钮会跳转到网页上 ——小卡遇到这个问题就是这样解决的↓↓↓ 解决方法:建议将代码放到</head>标签前,当然,另外存为一个js 文件引用也是可以的呦~ <script type="text/javascript"> //iOS Web APP中点击链接跳转到Safari 浏览器新标签页的问题 devework.com //stanislav.it/how-to-prevent-ios-standalone-mode-web-…

[HeadFrist-HTMLCSS学习笔记]第五章认识媒体：给网页添加图像

[HeadFrist-HTMLCSS学习笔记]第五章认识媒体:给网页添加图像干货 JPEG.PNG.GIF有何不同 JPEG适合连续色调图像,如照片:不支持透明度:不支持动画:有损格式 PNG适合单色图像和线条构成的图像,如logo,剪贴画等:无损格式:可选择文件大小:可透明和需要多种颜色 GIF是最早的Web图像格式,适合单色图像和线条构成的图像;支持动画 <img>元素 <img src="XX.gif">,src属性制定了图像的位置内联元素指向其他网…

建站手册-浏览器信息：苹果 Safari 浏览器

ylbtech-建站手册-浏览器信息:苹果 Safari 浏览器 1.返回顶部 1. http://www.w3school.com.cn/browsers/browsers_safari.asp 2. 2.返回顶部 1. 关于 Safari 在 2003 年 1 月,史蒂夫乔布斯(Steve Jobs)宣布苹果正在开发自己的浏览器:Safari. 在此之前,Mac 系统使用 Netscape Navigator 或 Internet Explorer 作为其默认浏览器. 第一个正式的 ("ou…

06_Linux基础-NGINX和浏览器、网页的关系-云服务器ssh登陆-安装NGINX-上传网页-压缩命令-xz-gzip-bzip2-zip-tar-配置NGINX服务器支持下载功能-备份脚本

06_Linux基础-NGINX和浏览器.网页的关系-云服务器ssh登陆-安装NGINX-上传网页-压缩命令-xz-gzip-bzip2-zip-tar-配置NGINX服务器支持下载功能-备份脚本一. NGINX和浏览器.网页的关系 nginx是一个web服务器 html语言编写网页 cd /usr/local/nginx html cd html/ (注:存放网页路径) 思考: 1.网页和nginx的关系 nginx将网页发送给浏览器 2.浏览器和nginx的关系浏览器问nginx要网页…

safari 浏览器window.history.go(-1)运行无效解决办法

这几天做了几个手机端app的wap页面,做完之后发现一个问题,那就是ios系统下的safari浏览器不支持window.history.go(-1)..无语... 解决方法很简单!加上return false; 就可以了~ <a href="#" class="back" onclick="javascript: window.history.go(-1);return false;"></a>…

苹果safari浏览器window.open问题

现象:在做项目的过程中,使用window.open打开新窗口,在windows系统的ie,firefox,chrome浏览器上测试均没有问题,在苹果系统的safari浏览器上发现有些window.open可以打开选项卡,有些不可以打开第一种可以打开选项卡第二种则打不开选项卡解决方案:百度发现"safari 中没办法在回调函数里面执行window.open, 原因是safari的安全机制将其阻挡了",解决办法就是在请求之前先打开一个空白窗口,在请求成功的回调函数里面:如果请求错误不…

safari浏览器在window下打开控制台

有时候需要在window下测试safari浏览器的兼容性然后需要打开错误控制台以下是完整打开的图文教程 1.显示菜单栏 2.打开偏好设置 3.然后切换到高级标签勾选在菜单栏显示开发菜单 4.打开开发菜单下的错误控制台 5.直接测试…

Safari浏览器中对js Date对象的支持

看了一下自己上一次写博客还是3月份,那是还没有毕业,实习也没那么多事情,毕业设计也才刚开始做,那时天天晚上都把电脑带回家继续学习,而现在一工作忙为借口已经不怎么进行什么知识总结了,只是在印象笔记里做做记录,今天解决完一个问题之后,突然很怀念曾经写博客的那种感觉,所以打开自己的博客地址,由于忘记了密码,所以也是费了很大的周折才找回了,改天在github上搭建一个博客好了.废话就说到这儿,进入干货模式. const startTime = Date.parse(new Date(rowData.st…

【关于在Safari浏览器中将网页添加到主屏幕的相关设置（自定义图标，启动动画，自定义名称）】的更多相关文章