viewport

How to get content currently being displayed in browser viewport

由 假装没事ソ 提交于 2019-12-07 00:51:54
问题 How can I get an indication of what part of a long document is currently being displayed? E.g. if my html contains 1,000 lines 1 2 3 ... 999 1000 and the user is near the middle showing the 500th line then I would like to get "500\n501\n502" or something like that. Obviously most scenarios would be more complex than this, but my requirement is to find which text is currently being displayed in the browser viewport so I can show a status value appropriate to the current text. Thanks Martin 回答1

Bootstrap CSS 概览

由 匆匆过客 提交于 2019-12-06 23:12:22
在这一章中，我们将讲解 Bootstrap 底层结构的关键部分，包括我们让 web 开发变得更好、更快、更强壮的最佳实践。 HTML 5 文档类型（Doctype） Bootstrap 使用了一些 HTML5 元素和 CSS 属性。为了让这些正常工作，您需要使用 HTML5 文档类型（Doctype）。 因此，请在使用 Bootstrap 项目的开头包含下面的代码段。 <!DOCTYPE html> <html> .... </html> 如果在 Bootstrap 创建的网页开头不使用 HTML5 的文档类型（Doctype），您可能会面临一些浏览器显示不一致的问题，甚至可能面临一些特定情境下的不一致，以致于您的代码不能通过 W3C 标准的验证。 移动设备优先 移动设备优先是 Bootstrap 3 的最显著的变化。 在之前的 Bootstrap 版本中（直到 2.x），您需要手动引用另一个 CSS，才能让整个项目友好的支持移动设备。 现在不一样了，Bootstrap 3 默认的 CSS 本身就对移动设备友好支持。 Bootstrap 3 的设计目标是移动设备优先，然后才是桌面设备。这实际上是一个非常及时的转变，因为现在越来越多的用户使用移动设备。 为了让 Bootstrap 开发的网站对移动设备友好，确保适当的绘制和触屏缩放，需要在网页的 head 之中添加 viewport

响应式和自适应区别

由 我怕爱的太早我们不能终老 提交于 2019-12-06 17:45:16
玩前端也有几个月了，发现大家普遍混淆了响应式和自适应的概念。先给大家体验一下响应式和自适应的区别，请放大缩小一下屏幕尝试 自适应的体验http://m.ctrip.com/html5/ 响应式的体验 http://segmentfault.com/ 整理了几篇自适应和响应式的文章，摘抄并修改了一下，请大家欣赏： 起初，网页设计者都会设计固定宽度的页面，最开始的电脑显示器分辨率种类不多，因为当时电脑本来就少，即使有变化也是 800 ||850|| 870|| 880。比如 开源中国 的网页就是固定宽度为998来定制的。至于为什么是 998 ，请 @红薯 后来随着显示器越来越多，以及笔记本的普及，这种方式的页面出现了问题。于是出现了一种新的布局方式宽度自适应布局。我们平时谈论的自适应布局，大多指的就是宽度自适应布局。 在这种布局下，出现了两派： 百分比宽度布局 流式布局 题主说的是第一派，宽度使用百分比，文字使用 em，现在也很多开始使用rem了，也就是所谓的高清方案。第二派的布局以 iGoogle 为代表（已经停止）。 一 开始没有响应式布局这个词语，但是慢慢出现了一个词——渐进增强，新词的出现总是伴随的旧词一起出现。就好比 3G 出现之前，没人管自己的手机叫 2G，所以，3G 和 2G 两个词是一起出现的（技术上当然2G技术先出现）。同理，渐进增强出现后，另一个词「优雅降级

Viewport for ipad portrait [only]

由 随声附和 提交于 2019-12-06 16:59:29
I have built a responsive website and it encounters problem while rendering in portrait orientation on iPad i.e It doesn't correctly fit in. I have tried adjusting the viewport meta's parameter values but that also affects the whole rendering, including on mobile. I used the following viewport meta in my website. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> I had a similar issue just now, on a site that is 1550px wide on desktop but only 880px on mobile. Things were working great with <meta name="viewport" content="width=880px, initial-scale=1.0, user

<meta name=\"viewport\" content=\"width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no\">

由 和自甴很熟 提交于 2019-12-06 16:47:10
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" /> 手机页面中在<head></head>中加入这句话，可以让页面适应设备的宽度。 width=device-width--宽度为设备宽度，如果你的页面宽度小于设备宽度，就需要修改一下这个属性，不然的话会出现可以页面左右滑动，如ipad ios7中客户端页面。 initial-scale - 初始的缩放比例 minimum-scale - 允许用户缩放到的最小比例 maximum-scale - 允许用户缩放到的最大比例 user-scalable - 用户是否可以手动缩放 来源： https://www.cnblogs.com/moppet/p/11995205.html

Printing viewport

由 时间秒杀一切 提交于 2019-12-06 15:56:57
C# wpf 3D visual studio 2010 net 4.5 Hi I am trying to print out the 3D image I have created but can not get it right. The image that is printed is changing in size depending on how large the window is etc. or it is clipped etc. What I would like is to print the view port on the printer, stretching it so wide as the paper is and keeping aspect ration. PrintDialog dialog = new PrintDialog(); if (dialog.ShowDialog() != true) { return; } StackPanel myPanel = new StackPanel(); myPanel.Margin = new Thickness(40); Image myImage = new Image(); myImage.Width = dialog.PrintableAreaWidth - (2 * MYDPI);

When using “Viewport Height/vh” in CSS does it include the “browser bookmark bar” in the total?

由 跟風遠走 提交于 2019-12-06 15:36:55
In Chrome, the bookmarks bar is disabled with command+shift+b. Should I always be testing sites with this disabled for the browser to truly be "100%"? Or does having this enabled actually make the "vh 95%" for example? vh uses the size of the viewport. So if you have the bookmarks bar open, then your viewport height is going to be smaller. Would be similar to just resizing your window and make the height smaller. https://www.w3.org/TR/css-values-3/#viewport-relative-lengths The viewport-percentage lengths are relative to the size of the initial containing block. When the height or width of the

Real coordinates for graph inside viewport relative to mouse coordinates

由 大城市里の小女人 提交于 2019-12-06 15:18:53
As I have specified in the title, I have started to work on a simple application what contains in the main frame window, a double buffered panel. Inside this panel some graphics can be drawn, let's consider this panel is a simple viewport for the elements drawn inside. Two functionalities were added here, pan and zoom what can scale transform and translate transform inside paint event using a delta updated on MouseDown and Move events and OnMouseWheel for updating the scale transform. The real problem has arrived after trying to add a functionality to support creation of a Node (graphic

How to set the viewport on a non-responsive mobile site?

由 老子叫甜甜 提交于 2019-12-06 14:38:28
I am styling a non-responsive website and having issues in mobile views. I have no viewport set. I assume content should appear the same on mobile as it does on desktop only zoomed out. Here is a visual of my issue: Explanation: When viewing on desktop it is fine. On iPhone (mobile) the header, nav and footer's widths shrink (see image) and the main content essentially extends beyond the phone viewframe (or viewport or whatever)... Thanks! If your site is not responsive, it will help to set a viewport. Open up the site in your web browser and find the minimum width that causes your design to

Webgl update region using viewport+scissor

由 风流意气都作罢 提交于 2019-12-06 11:44:41
I've been trying to create a multiviewport webgl application. I got everything rendering quite nice using viewport+scissor for each view. But now I would like to improve rendering and just render the view which is updated, so skip overdrawing. I've made a little demo showing the idea: http://kile.stravaganza.org/lab/js/scissor/ As I understand scissor it's suposse that it will just render the current scissor box and keep the rest of the canvas untouched. But it seems that it just keeps clearing the whole canvas on each frame, no matter what I tried :( This is the rendering code (The last view
订阅 viewport