首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在“添加到主屏幕”之后保留iOS 13.2中的地址栏

在iOS 13.2中,当用户将网页添加到主屏幕后,地址栏默认是隐藏的。这样可以使网页看起来更像一个独立的应用程序。然而,如果你希望在添加到主屏幕后仍然保留地址栏,可以按照以下步骤进行操作:

  1. 打开Safari浏览器并访问你想要添加到主屏幕的网页。
  2. 点击底部的分享按钮(一个方框带箭头)。
  3. 在分享菜单中,向下滑动并找到“添加到主屏幕”选项,然后点击它。
  4. 在弹出的添加到主屏幕页面中,你可以看到网页的名称和图标预览。在这个页面上,你可以编辑网页的名称,然后点击“添加”按钮。
  5. 现在,网页将会被添加到主屏幕,并且地址栏将会被隐藏。

如果你希望在添加到主屏幕后保留地址栏,你可以使用以下方法:

  1. 在网页中添加一个自定义图标,该图标将作为网页的应用程序图标显示在主屏幕上。你可以在网页的HTML代码中添加以下代码来指定图标:
代码语言:txt
复制
<link rel="apple-touch-icon" href="path/to/icon.png">

其中,path/to/icon.png是你自定义图标的文件路径。

  1. 创建一个简单的JavaScript函数,用于在网页加载时自动跳转到完整的网页URL,以显示地址栏。你可以在网页的HTML代码中添加以下代码:
代码语言:txt
复制
<script>
    if (window.navigator.standalone) {
        var url = window.location.href;
        window.location.href = url;
    }
</script>

这段代码会检查用户是否通过主屏幕上的应用程序图标打开网页,如果是,则会自动跳转到完整的网页URL。

通过以上步骤,你可以在添加到主屏幕后保留iOS 13.2中的地址栏。请注意,这些方法只适用于iOS 13.2及更高版本的设备。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

移动Web 开发中一些前端知识收集汇总

私有meta标签,它表示:允许全屏模式浏览,ios上,用户将网页添加到屏后,再从屏幕打开这个网页,可以隐藏浏览器地址栏和下面的toolbar; 第二个meta标签表示:强制让文档宽度与设备宽度保持...--不让android识别邮箱--> 自定义屏上图标 用户添加到屏后,如果网站没有图标,则默认屏上图标为当前网页截图,你可以通过下面的代码指定在普通和retina屏幕icon: <link...关闭iOS中键盘自动大写、自动更正、自动完成 iOS中,当虚拟键盘弹出时,默认情况下键盘是开启首字母大写功能,根据某些业务场景,可能我们需要关闭这个功能,移动版本webkit为input元素提供了...-webkit-transform-style: preserve-3d;/*设置内嵌元素 3D 空间如何呈现:保留 3D*/ -webkit-backface-visibility: hidden...事件短按屏幕时会有明显延迟(相对用户手离开屏幕那一刻大约300ms),因此建议采用 touchstart 事件。

3.8K50

移动端常见问题解决方案

-webkit-box-sizing:border-boxx 清除点击高亮,设置transparent 完成透明 -webkit-tap-highlight-color:transparent; 取消ios...和 Chrome 内核 添加到屏幕时隐藏地址栏和状态栏(即全屏) 当我们将一个网页添加到屏幕时,会更希望它能有像 App 一样表现,没有地址栏和状态栏全屏显示,代码如下: 该方案 iOS...添加到屏幕时设置系统顶栏颜色 当我们将一个网页添加到屏幕时,还可以对系统显示手机信号、时间、电池顶部状态栏 颜色进行设置,前提是开启了: 有了这个前提,你可以通过下面的方式来进行定义: content...,网页从状态栏以下开始显示; 如果设置为 black-translucent,状态栏将为灰色半透明,网页将充满整个屏幕,状态栏会盖在网页之上; 该设置只 iOS 上有效。...$('.open').click(()=>{ // 弹出层显示之前,记录当前滚动位置 scrollTop = getScrollTop(); $('.workflow-modal

1.2K10

界面劫持之触屏劫持

通过将一个不可见iframe覆盖到当前网页上就可以劫持用户触屏操作。由于手机屏幕范围有限,手机浏览器为了节省空间会把地址栏隐藏起来,因此在手机上视觉欺骗更容易实施。...据悉超过78%Android设备受此漏洞影响。02触屏劫持技术原理1.桌面浏览器iOSsafari浏览器可以将一个网页添加到桌面,当做一个独立应用运行。...添加后,屏幕上会出现一个由网页缩略图生成App图标。类似于快捷键方式。这样可以方便进行页面篡改等。...2.隐藏URL地址栏为了不让用户发现点击按钮后跳转到了奇怪url地址,我们需要进行视觉欺骗,最简单有效就是隐藏URL地址栏,除了用全屏模式隐藏URL地址栏外,还可以使用以下代码实现URL地址栏隐藏...苹果手机使用Safari浏览器时候,遇到不明情况提示框或页面,一定要确认地址栏地址是否隐藏以及是否正确,若网站上含有触屏劫持,则大概率会添加假地址栏做误导,需谨慎认清。

26120

自定义地址栏与收藏夹中图标

如果网站上传了这个图标文件,用户使用浏览器(仅限于支持这个功能浏览器)浏览时,就可以把图标显示浏览器地址栏中(有时也会显示历史记录中),如果添加了收藏则收藏夹中也可以看到图标。...主要使用在 Internet Explorer 收藏夹中,如果网站被添加到收藏夹中,那么地址栏中也会被显示出来。...这么做还有一个用意就是统计有多少用户收藏了这个网站(可以日志中看 favicon 请求次数)。现代浏览器则不管用户是否收藏该网站,都会把图标显示地址栏或页签中。...苹果(Apple)设备,以及部分安卓(Android)设备,可以使用 添加到屏幕 Add to Home Screen(Web Clip) 功能在手机屏幕上添加一个自定义图标。...一些如 SSLStrip 中间人攻击工具也使用这种伎俩。为了识别这种伎俩,有的浏览器Tab页签中显示 favicon ,地址栏最左边显示协议安全状态。

1.9K50

【WebApp开发必知】移动游览器私有Meta属性

Meta属性移动端可以说是不得不知道使用得非常频繁技术。下面就给大家整理一下移动端各大浏览器一些私有的Meta属性。 一、Safari浏览器私有 Meta 属性 1.让文档宽度与设备宽度保持1:1,并且文档最大宽度比例是1.0,且不允许用户点击屏幕放大浏览...; 2.ios上,用户将网页添加到屏后,再从屏幕打开这个网页,可以隐藏浏览器地址栏和下面的toolbar; 3.其值有三个: default(白色)black(黑色) black-translucent...4.开启对web app程序支持 5.是指在发送到屏幕时候默认命名。 6.让网页加载时便可隐藏顶部地址栏与底部导航栏。 二、QQ浏览器私有 Meta 属性(x5内核定制标签) <!

1.8K20

PWA - 令人惊奇web用户体验新方法

file 提供类似于 APP 使用体验( Android 上可以设置全屏显示,由于 Safari 支持度问题,所以 IOS 上并不可以 ),并且还能进行 ”推送通知” 。...安全:PWA使用https进行通信加密,防止了被第三方获取数据以及数据被篡改 推送:做到不打开网页前提下,推送新消息 可安装:能够将 Web像 APP 一样添加到桌面,可以屏幕上创建图标 为什么是渐进式...Chrome 浏览器 debug 使用 Chrome 浏览器,可以通过进入控制台 Application -> Service Workers 面板查看和调试 APP Manifest (应用清单)与添加到屏幕...Web App Manifest 是一个 JSON 格式文件用来描述应用相关信息,目的是提供将应用添加至桌面的功能: 能够将你浏览网页添加到手机屏幕 Android 上能够全屏启动,不显示地址栏...( 由于 Iphone 手机浏览器是 Safari ,所以不支持哦) 控制屏幕 横屏 / 竖屏 展示 定义启动画面 可以设置你应用启动是从屏幕启动还是从 URL 启动 可以设置你添加屏幕应用程序图标

2.5K10

将你网站打造成一个iOS Web App

Icon 当用户通过safari访问我们网站时候,用户是可以把网站URL以一个快捷方式形式添加到屏幕,展示形式跟原生应用是一样,所以我们要给我们网站添加应用Icon。 ? ?...如果你网站也要可以Ipad上访问,那么你还要针对不同设备准备不同尺寸icon,你可以通过sizes属性来指定icon尺寸: <link href="touch-icon-iphone.png"...72x72,retina屏幕iphone所需尺寸是114x114,retina屏幕ipad所需尺寸是144x144。...如果有多个符合条件icon,那么iOS会选择有precomposed关键词那个。 如果在HTML中没有指定icon,那么iOS会到WEB根目录下寻找对应icon。...隐藏Safari用户栏 为了更加像原生应用,我们还可以对Safari用户栏和地址栏进行隐藏,这个叫作standalone模式,加入以下meta进入此模式: <meta name="apple-mobile-web-app-capable

1.9K60

如何使用浏览器工具调试PWA

清单(Manifest) 清单让用户可以选择把应用『添加到屏幕』。清单提供了很多应用被安装到到设备该如何表现细节说明。任何错误定义清单将会报告问题。 ?...主题颜色:指示你网站主题。Chrome使用这个主题颜色来着色浏览器一些UI部分,比如地址栏。...可以使用meta标签来自定义每个页面的颜色,但是当应用从屏启动时,清单中指定主题颜色提供站点范围主题颜色。 ?...桌面Chrome上,它会触发浏览器将应用添加到货架(shelf)。 移动设备上,它提示安装应用程序(将图标添加到屏幕): ?...设备模式屏幕下,离线也是强制,除网络节流。 重新加载更新:当调试时,这个非常有用。Service Workers首次加载时会将其安装在设备上。

3.6K40

苹果发布iOS12.2 beta:暗示AirPods 2将要到来

其中最为引人注目的是,iOS 12.2 beta 中设置「Hey Siri」时,会出现“可通过 AirPods 或者 iPhone 来激活 Siri”内容,而一代 AirPods 并不支持此功能,这似乎暗示着二代...1.流畅度/耗电/发热:iOS12.2 beta 总体表现依旧流畅,网络连接问题和信号问题已有所缓解。新系统升级和使用过程也未见明显发热显现,续航问题没有什么特别的感受,还有待继续观察。...3.不安全网站提醒:未使用安全 HTTPS 连接网页现在将以十分显眼方式被标示出来,会在地址栏中显示「不安全」字样。...5.HomeKit TV 支持:苹果近日宣布多家厂商电视已开始支持 HomeKit,而 iOS 12.2 也开始让用户将其电视添加到 HomeKit 框架中。...6.全新图标:控制中心重新设计了屏幕镜像图标,从之前屏幕+箭头图标改成现在屏幕设计。「隔空播放」图标也进行了重新设计。

25330

PWA介绍及快速上手搭建一个PWA应用

Engaging : PWA 可以添加在用户屏幕上,不用从应用商店进行下载,他们通过网络应用程序 Manifest file 提供类似于 APP 使用体验( Android 上可以设置全屏显示哦...,由于 Safari 支持度问题,所以 IOS 上并不可以 ),并且还能进行 ”推送通知” 。...Manifest PWA 中作用有: 能够将你浏览网页添加到手机屏幕 Android 上能够全屏启动,不显示地址栏 ( 由于 Iphone...手机浏览器是 Safari ,所以不支持哦) 控制屏幕 横屏 / 竖屏 展示 定义启动画面 可以设置你应用启动是从屏幕启动还是从...: “ “ 用来告知浏览器用什么颜色来为地址栏等 UI 元素着色 background_color: “ ” 设置启动页面的背景颜色 icons:”” 就是添加到屏幕之后图标 { "name

2.2K130

IOS开发系列——UIView专题之一:UIWindow篇

iOS程序启动完毕后,创建第一个视图控件就是UIWindow,接着创建控制器view,最后将控制器view添加到UIWindow上,于是控制器view就显示屏幕上了。...一个iOS程序之所以能显示到屏幕上,完全是因为它有UIWindow。也就说,没有UIWindow,就看不见任何UI界面。...程序启动完毕之后就会调用一次,创建过程如下: 提示:应用程序启动之后,先创建Application,再创建它代理,之后创建UIwindow。UIWindow继承自UIview。...提示:如果UItextfield不显示,可以考虑设置它样式,因为其创建默认是虚线,没有边框。 ios7里边,窗口和次窗口是没有区别的。...ios7以前中有区别:哪个是窗口,后面设置为主窗口会把之前设置覆盖掉。(只有主窗口才能响应键盘输入事件,如果不能输入内容,可以查看是否是显示窗口上,不在窗口上不能响应。)

74430

爆料最新IOS18系统,这些功能真心好用到爆

Apple 音乐可能会获得自动生成列表,提醒应用程序有望与日历应用程序集成,照片应用程序有望具有人工智能照片修饰功能。 除了 AI 功能外,iOS 18 还将带来更加可定制屏幕。...应用程序图标可以放置屏幕网格上任何位置,用户可以为应用程序图标选择自定义颜色。 据彭博社报道,马克·古尔曼认为,iOS 18 将是一个“相对突破性”软件更新,具有“主要新功能和设计”。...屏幕改版 iOS 18 预计将具有更可自定义屏幕,为 iPhone 用户提供更多 iPhone 外观选择。Apple 计划让客户更好地控制其应用程序图标的排列方式。...iOS 18 可能会给我们带来多年来最重大屏幕更新,与苹果在 iOS 16 中推出锁定屏幕更改相当。...图标颜色 苹果预计将允许用户 iOS 18 中更改应用图标的颜色,因此图标将不再局限于开发人员提供颜色。例如,用户可以将所有社交图标设为蓝色,或将所有消息相关图标设为绿色,从而简化屏幕

10410

2年内彻底摆脱英特尔,苹果重磅发布自研Mac芯片,并对“五大系统”再升级

一直以来,简单,或者说是单一都是iOS界面的特色之一,此次苹果为iOS 14增添了一项名为“App Library(应用资源库)”功能,不仅能自动整理应用,还能从常用和最近打开应用等维度进行智能分类...为解决这一问题,iOS 14对Widgets进行了重新设计,如尺寸可调、可显示于屏幕、智能叠放等,都是为了给用户提供更直观、可定制化内容即功能,如小部件可以叠放,且智能显示“重要”信息。...画中画则是将iPadOS中功能搬到了iOS上,即在iOS 14中,用户可以屏幕上以画中画形式观看视频,窗口大小可调整,且视频总在屏幕上层。与此同时,屏幕侧边还可隐藏,观感更加简洁。...当然,提到iOS便不得不提Siri,以往召唤Siri之后屏幕总是呈现黑色,iOS 14对此进行了重新设计,让Siri屏幕上以图标形式显示出来,全面实现“透明化”。...具体来看,iPadOS 14中,Apple Pencil可识别用户手写内容,如用户可以在网页地址栏中直接通过手写方式,让系统自动识别手写内容,且支持英文、中文、数字等多类型识别。

97530

没有新硬件WWDC,就不行吗

首先在FaceTime上,空间音频可在屏幕上反映通话者位置,语音隔离功能可以减少背景噪音干扰。人像模式虚化背景也可以FaceTime中使用,用户还可以通话中分享音乐和视频。...比如下班后你就可以设置只接收亲人好友通知。 同时,用户可以自定义屏幕页面,选择适合焦点模式小工具和应用程序。不仅如此,用户还可以批量处理某些通知,将其作为摘要接收。 消息也有一些更新。...此前据传,iPadOS 15将使屏幕更具可定制性,允许更灵活地放置小部件。...离iPadOS 15正式使用还有几周时间,或许测试阶段,还会有更多改进和惊喜。 macOS 12:加强和iPad互动 iOS和iPadOS之后,全新版macOS也不容小觑。...此外,Safari正在进行一些重新设计,标签和地址栏都移到了同一个地方,标签也获得了一种新浮动外观。

1.5K20
领券