精华内容
下载资源
问答
  • 2012-06-30 12:28:29

    如何隐藏iPhone Safari的地址栏
    设置这个属性(文档里面说有用,但是好像不太成功)

    <meta name="apple-mobile-web-app-capable" content="yes" />

    还有一种办法,页面加载完成之后滚动窗口,这个确实有效,唯一要注意的是页面高度必须够长,我一般设成device-height就没问题了:

    <script type="text/javascript"> 
          addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); 
          function hideURLbar(){ 
                    window.scrollTo(0,1); 
          } 
    </script>

    更多相关内容
  • 主要介绍了移动端WebApp隐藏地址栏的方法,本文分别给出了4种方法,适应不同情况下使用,小编推荐最后一个方法,需要的朋友可以参考下
  • 要注意的几个点:这个方法要在内容加载完成后执行,换句话浏览器内容的高度要超过浏览器窗口高度(出现‘滚动条’)才有效。 针对这个高度自适应的窗口...转载地址: http://www.jslover.com/code/357.html

    要注意的几个点:这个方法要在内容加载完成后执行,换句话浏览器内容的高度要超过浏览器窗口高度(出现‘滚动条’)才有效。

    针对这个高度自适应的窗口(height:100%),得用特殊方式解决:

    //强制让内容超过
    $('#main').css("height",window.innerHeight+100);
    window.scrollTo(0, 1);
    //重置成新高度
    $("#main").css("height",window.innerHeight);
    //非常重要,用于兼容不同机型,防止浏览器窗口移动
    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

    另外,最后一行,用于阻止手动滚动页面

    转载地址:http://www.jslover.com/code/357.html

    展开全文
  • 1、很多资料说,添加以下代码,可以隐藏地址栏,但我试了很多次,貌似不成功啊。 &lt;meta name="apple-mobile-web-app-capable" content="yes" /&gt; 2、我们可以通过另一种方法...

    1、很多资料说,添加以下代码,可以隐藏地址栏,但我试了很多次,貌似不成功啊。

    <meta name="apple-mobile-web-app-capable" content="yes" />

    2、我们可以通过另一种方法来隐藏地址栏。在页面加载完成之后滚动窗口,这个确实有效,唯一要注意的是页面高度必须够高,核心代码如下:

    <script type="text/javascript"> 
          addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); 
          function hideURLbar(){ 
                    window.scrollTo(0,1); 
          } 
    </script>

    3、但是当页面高度自适应窗口(height:100%),以上方法就不适用了,我们需要采用特殊方法:

    $('div').css("height",window.innerHeight+100);  //强制让内容超过  
    
    window.scrollTo(0, 1);  
    
    $("div").css("height",window.innerHeight);  //重置成新高度  
    
    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);  //如果不想让页面滑动,可以加上这段代码

     

    参考资料:http://jslover.com/?p=357

     

     

    展开全文
  • 修改好网址后 就可以直接用 webapp是不让上架的 只做内部测试
  • 隐藏移动Web应用程序中的地址栏 通过将iOS和Android驱动的设备都使用WebKit作为浏览器的呈现引擎,Web开发人员具有许多优势: 具有完美CSS动画功能的渲染引擎 快速的渲染引擎... 非常快 具有现代感和前瞻...

    移动端web隐藏工具栏

    iPhone Hide Address Bar

    With both iOS and Android-driven devices using WebKit as their browser's rendering engine, web developers have many advantages:

    通过将iOS和Android驱动的设备都使用WebKit作为浏览器的呈现引擎,Web开发人员具有许多优势:

    • A rendering engine with capable of flawless CSS animations

      具有完美CSS动画功能的渲染引擎
    • A rendering engine that's fast...very fast

      快速的渲染引擎... 非常

    • A rendering engine that's modern and forward-thinking

      具有现代感和前瞻性的渲染引擎

    These advantages allow us to create web apps within that browser that look as good as native applications.  If your goal is to create web apps that look like native applications, the details count.  One of those details:  hiding the address bar.  Native applications don't have address bars so why should your app? As an added bonus, hiding the address bar will provide you an extra 60 pixels of space!

    这些优势使我们能够在浏览器中创建外观与本地应用程序一样好的Web应用程序。 如果您的目标是创建看起来像本机应用程序的Web应用程序,那么详细信息就很重要。 这些细节之一:隐藏地址栏。 本机应用程序没有地址栏,那么为什么要使用您的应用程序? 另外,隐藏地址栏将为您提供额外的60像素空间!

    You may think hiding the address bar within the mobile browser is difficult but you'd be surprised how simple it is.  All you need is a touch of JavaScript!

    您可能会认为很难在移动浏览器中隐藏地址栏,但您会惊讶地发现它是如此简单。 您只需要一点JavaScript!

    JavaScript (The JavaScript)

    
    // When ready...
    window.addEventListener("load",function() {
    	// Set a timeout...
    	setTimeout(function(){
    		// Hide the address bar!
    		window.scrollTo(0, 1);
    	}, 0);
    });
    
    
    

    The window.scrollTo method is the key to hiding the address bar.  The wrapping setTimeout function is required by the iPhone to properly hide the address bar -- not using setTimeout will cause problems.

    window.scrollTo方法是隐藏地址栏的关键。 iPhone需要包装的setTimeout函数才能正确隐藏地址栏-不使用setTimeout会引起问题。

    奖励:书签站点的META标签 (Bonus: META Tag for Bookmarked Sites)

    If a user has added your web application to their springboard, the following meta tag can remove the top bar from the browser:

    如果用户已将您的Web应用程序添加到其跳板,则以下meta标签可以从浏览器中删除顶部栏:

    
    <meta name="apple-mobile-web-app-capable" content="yes" />
    
    
    

    And that's all!  The address bar is hidden until the user swipes down near the top bar of the application.  With the address bar hidden, your web app can look just like a native app!

    就这样! 地址栏将一直隐藏,直到用户在应用程序顶部栏附近向下滑动为止。 隐藏地址栏后,您的Web应用程序看起来就像是本机应用程序!

    翻译自: https://davidwalsh.name/hide-address-bar

    移动端web隐藏工具栏

    展开全文
  • 1、很多资料说,添加以下代码,可以隐藏地址栏,但我试了很多次,貌似不成功啊。 <meta name="apple-mobile-web-app-capable" content="yes" /> 2、我们可以通过另一种方法来隐藏地址栏。在页面加载完成之后...
  • 移动端webapp如何隐藏地址栏

    万次阅读 2014-09-19 16:26:43
    1、很多资料说,添加以下代码,可以隐藏地址栏,但我试了很多次,貌似不成功啊。 meta name="apple-mobile-web-app-capable" content="yes" /> 2、我们可以通过另一种方法来隐藏地址栏。在页面加载完成之后滚动...
  • 移动端webapp 全屏

    2019-11-18 19:04:05
    最近使用vux开发一款手机webapp,在手机上看到地址栏和下面的工具栏占了很大一部分空间,就想可不可以去掉。最终找到了解决办法。我用的是vue cli生成的模板,在项目根目录下的index.html头部加上下面内容: ...
  • 1234第一个meta标签是iphone设备中的safari私有meta标签,它表示:允许全屏模式浏览,在ios上,用户将网页添加到主屏后,再从主屏幕打开这个网页,可以隐藏浏览器的地址栏和下面的toolbar;第二个meta标签表示:强制...
  • 对于使用ipad浏览器,发现无法全屏浏览,顶部的时间电池通知,一直显示。下载了很多国内浏览器无法解决。试了下几个国外的,发现这几个好用。 推荐一WebApp Browser 下载安装后,输入想要全屏浏览的地址,把...
  • webApp总结

    2019-10-08 10:44:33
    -- 可隐藏地址栏,仅针对IOS的Safari(注:IOS7.0版本以后,safari上已看不到效果) --> < meta name= "apple-mobile-web-app-capable" content= "yes" /> <!-- 仅针对IOS的Safari顶端状态条的样式(可选default...
  • 原生体验 - 可以和app一样拥有首屏加载动画,可以隐藏地址栏等沉浸式体验。 粘性 - 通过离线通知,可以让用户回流。 manifest 应用程序清单的配置 manifest是一个可配置的json文件,可以使web添加至桌面,设置启动...
  • 接下来给大家来详细讲解一下:在上一节中我们已经介绍怎么去做一个开机引导图了[webAPP项目]基于MUI框架webAPP开发功能流程之引导图制作详解01如果不会的,就按照上一篇文章讲解的自己在作一遍.效果图最终我们要实现的...
  • 移动端音乐WebApp

    千次阅读 2019-07-15 18:40:30
    │ ├─search ->整个搜索页面的实现 │ ├─singer ->所有歌手列表页(引用listview) │ ├─singer-detail ->歌手详情页(引用music-list) │ ├─suggest ->搜索页面核心组件,数据获取等 │ ├─tab ->导航(歌手...
  • iphone webapp

    2019-09-24 18:30:16
    App 图标 (apple-touch-icon可以指定sizes来告诉设备该使用哪个图片)苹果从IOS4.2开始mobile safari就开始支持把网页保存至主屏,从而使得用户可以方便的从主屏的快捷方式进入webapp,而通过苹果提供给我们的API...
  • IOS启用WebApp全屏模式

    千次阅读 2018-03-01 16:13:00
    当网站添加到主屏幕后再点击进行启动时,可隐藏地址栏(从浏览器跳转或输入链接进入并没有此效果) 代码实例如下: 1 2 <meta name="apple-mobile-web-app-capable" content="yes" /> <meta nam...
  • iphone中safari私有meta标签,允许全屏模式浏览,隐藏浏览器导航 --> < meta name ="apple-mobile-web-app-capable" content ="yes" /> 特殊情况需要用到的meta标签 <!-- 启用360浏览器的极速模式...
  • webApp 开发技术要点总结

    千次阅读 2018-09-18 13:05:20
    推荐一个web前端学习 QQ群606721798,欢迎大家加入,每天晚上在腾讯课堂都有一个技术学习课,会有...接触 webkit webapp的开发已经有一段时间了,现把一些技巧分享给大家 : 1. viewport: 也就是可视区域。对于桌...
  • ios制作h5的桌面webapp的详解

    千次阅读 2018-01-04 14:59:56
    -- 隐藏浏览器的工具栏以及地址栏 --> < meta name = "apple-mobile-web-app-capable" content = "yes" >   <!-- 设置顶端手机状态栏的背景颜色 --> < meta name = "apple-mobile-web-app-status-bar-...
  • webapp摘要

    2015-01-28 17:37:00
    对于桌面浏览器,我们都很清楚viewport是什么,就是出去了所有工具、状态、滚动条等等之后用于看网页的区域,这是真正有效的区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport; 实际上我们...
  • 8、ios5+可以通过scrollTo(0,0)来自动隐藏浏览器地址栏。 9、css3动画会影响你的自动聚焦,所以自动聚焦要在动画执行之前来做,或者直接舍弃。 10、如果涉及较多域外链接,DNS Prefetching可以帮你做DNS预解析。 ...
  • 原文地址:http://www.cnblogs.com/yexiaochai/p/3759959.html#!comments 单页or多页 本文仅代表个人观点,不足请见谅,欢迎赐教。 webapp 小钗从事单页相关的开发一年有余,期间无比的推崇webapp的网站模式...
  • 可以看到用户添加到主屏幕后,有了自定义的图标及启动图,打开webapp后也不会有safari的地址栏和工具栏,体验跟原生一样。 因为我使用iphone自带的屏幕录制功能,所以顶部状态栏背景被占用,实际体验启动图是全屏的...
  • 如果你是一名前端er,又想在移动设备上开发出自己的应用,那怎么实现呢...对于桌面浏览器,我们都很清楚viewport是什么,就是出去了所有工具、状态、滚动条等等之后用于看网页的区域, 这是真正有效的区域。由于移

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,035
精华内容 814
关键字:

webapp隐藏地址栏

友情链接: Embedded_C.zip