viewport

Hide Safari address bar and footer

由 折月煮酒 提交于 2019-12-03 02:09:53
问题 On my jQuery Mobile project I'm using the following code: <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"> I'm getting the Safari browser address bar and nav footer. How can I hide those so I can just have my app showing? 回答1: You can setup a few meta tags to tell iOS that your site can be added to the Home Screen as a web app. Once launched from there, all of the Safari elements are hidden. Check out the section titled "Hiding Safari User Interface

Impossible to hide navigation bars in Safari iOS 7 for iPhone/iPod touch

由 匿名 (未验证) 提交于 2019-12-03 02:08:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I don't believe there is any solution to hide bars programmatically using javascript/css/html, but let me try to describe a problem. We are the team of mobile game developers and we have been developing a game for one year. After iOS 7 announcement we have faced the problem that it is IMPOSSIBLE to hide the navigation bars. Once user taps in the upper or lower part of the Safari browser, navigation bars are appearing again and hide all controls of the game. The only solution we have found so far is forcing user to: Rotate device Scroll the

Detecting HiDPI Windows Phone 8 Devices

由 匿名 (未验证) 提交于 2019-12-03 02:05:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: How do I detect HiDPI devices running Windows Phone 8? The phone I'm testing is the Nokia Lumia 920, which has a 4.5-inch 1280 × 768 screen (i.e. > 300 dpi). IE supports min-resolution in CSS but not min-device-pixel-ratio . Using this device pixel density test , the Lumia reports 96 dpi . This is far lower than the actual screen resolution, and would be considered a regular non-HiDPI device. Since IE doesn't (yet) support window.devicePixelRatio in JavaScript, I can't find a way to accurately detect the Lumia as capable of displaying HiDPI

How to check the element is in viewport on angular 2?

由 匿名 (未验证) 提交于 2019-12-03 01:36:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 由 翻译 强力驱动 问题: How to check element is in viewport in angular 2?. I have tried with many npm packages. But not working. How to check the element is in viewport?. I want to call API on page scroll if element is in viewport? I have three tabs. I have to check if tab is active and element is in viewport. How to check? 回答1: I used ' jQuery-viewport-checker ' to perform various tasks if elements are on viewport. It worked for me. This may help you: Follow this if you don't have "jQuery" working in your angular 2 project: https://stackoverflow.com/a

How to set browser viewport size

由 匿名 (未验证) 提交于 2019-12-03 01:22:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I'm trying to create a cross-browser Python-Selenium test script. So I need all results to be same no matter which webdriver ( Chrome or IE ) I use. I can set browser window size as follow: driver.set_window_size(1920, 1080) But following code will return different values for Chrome and IE : element = driver.find_element_by_xpath('some_xpath') element.location as viewport area (where web-content displayed) sizes are different ( Chrome - 1910x998, IE - 1904x965) despite of same window size. To get these values I used driver.execute_script(

How to use percentage for font in different screen size

由 匿名 (未验证) 提交于 2019-12-03 00:56:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I have the following DIVs: <div class="tckLeftHolder"> <div class="tckLeftContents"> <span>URGENT CARE WAIT</span> </div> </div> CSS: .tckLeftContents { text-align: center; width: 90%; padding: 0 0 0 10%; height: 35px; overflow: hidden; } .tckLeftHolder { float: left; width: 25%; height: 35px; line-height: 17px; vertical-align: middle; background: #EA7C30; border-top-left-radius: 10px; border-bottom-left-radius: 10px; color: #FFFFFF; font-family: Verdana; font-size: 10px; overflow: hidden; text-align: center; box-shadow: inset 0 -1px 1px

HTML5 Boilerplate: Meta viewport and width=device-width

由 匿名 (未验证) 提交于 2019-12-03 00:46:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 由 翻译 强力驱动 问题: I'm building an adaptive/responsive website. Regarding this recent change to the HTML5BP: " mobile/iOS css revisions " I've started using: ... and I have this in my CSS: html { - webkit - text - size - adjust : 100 %; - ms - text - size - adjust : 100 %; } When initial-scale=1 was included, rotating from vertical to horizontal (on iPad/iPhone) caused the layout to change from 2 columns (for example) to 3 columns (due to meida queries, initial-scale=1 and JS fix for viewport scale bug ). To summarize , when in landscape mode, this

Redis消息队列实现秒杀

由 匿名 (未验证) 提交于 2019-12-03 00:43:02
消息队列的应用场景例如：秒杀、抢单功能。 下面写个Demo简单实现一下秒杀，也就是抢购。 首先创建一个 lpush.html 文件，代码如下： <!DOCTYPE html> <html> <head> <title>TODO supply a title</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="jquery-3.2.1.min.js" ></script> <script> function push(uid){ $('#msg'+uid).html('请耐心等待.......'); $.get('lpush.php',{"uid":uid},function (data){ if(data == 1 ){ $('#msg'+uid).html('抢购成功!!'); }else{ $('#msg'+uid).html('抢购失败!!'); } }); } </script> </head> <body> <span id="msg5"></span><br> <input type="button" value="抢购5" onclick="push(5)"><br> <span id=

Visual viewport vs Layout viewport on mobile devices

由 筅森魡賤 提交于 2019-12-03 00:33:50
问题 I've just read a nice article on viewport which left me with a couple questions regarding Visual viewport vs Layout viewport on mobile devices. the width and the height of the layout viewport are equal to whatever can be shown on the screen in the maximally zoomed-out mode I did not quite understand what that means. When they say "maximally zoomed-out mode", does that mean that the layout viewport is different for different HTMLs (and not specific to different devices like iPad, Xoom, etc)?

meta name="viewport" content="width=device-width,initial-scale=1.0" 解释

由 匿名 (未验证) 提交于 2019-12-03 00:27:02
jsp中<head/>中的<meta/>标签中发现这句话，不太明白。记录下来。 <meta content="width=device-width, initial-scale=1, maximum-scale=1"> width=device-width 可视区域的宽度，值可为数字或关键词device-width intial-scale:页面首次被显示是可视区域的缩放级别，取值1.0则页面按实际尺寸显示，无任何缩放 maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别， maximum-scale用户可将页面放大的程序，1.0将禁止用户放大到实际尺寸之上。 user-scalable:是否可对页面进行缩放，no 禁止缩放 主要作用就是为了让这个页面不论是PC端或者浏览器端都可以自适应宽度和高度。具体可以参考以下文章： 点击打开链接 转载请标明出处: meta name="viewport" content="width=device-width,initial-scale=1.0" 解释 文章来源: meta name="viewport" content="width=device-width,initial-scale=1.0" 解释
订阅 viewport