草庐IT

viewport

全部标签

javascript - 从 Openlayers 3 视口(viewport)获取所有功能

我正在尝试找出Openlayers3图层上所有可见的(视口(viewport))特征。如果我向map添加一个点击事件,我就能够找到一个单一的特征,如下所示。但是我无法找到视口(viewport)中可见的所有功能。有人可以帮忙吗?map.on('click',function(evt){varfeature=map.forEachFeatureAtPixel(evt.pixel,function(feature,layer){returnfeature;});}); 最佳答案 我建议您首先了解View的范围:varextent=you

javascript - 检测在不可见和在视口(viewport)外时是否对canvas/css3动画进行了优化

我假设使用HTML5中的所有这些硬件加速动画,实际上不会渲染在视口(viewport)之外运行的动画。我希望能够检测到是否正在发生。我尝试在每秒移动100px的对象上循环使用webkitCSSMatrix来尝试确定每个刻度线移动了多少像素,但是如果我将动画移出视线则没有区别。有任何想法吗? 最佳答案 您可以使用单独的计时器测试来查看伪经验方面在外部和内部绘制的对象之间的差异(计时器实际上并不能证明任何东西,但可以为您提供强大的indisium)。但是,了解Canvas的工作原理也可以为您提供坚实的指导。例如,Canvas是一个简单的

javascript - PDF.JS PDF 渲染不正确,出现镜像和颠倒

我正在尝试让pdf.js在IE中工作。我几乎完全从pdf.js站点上的“使用base64编码的PDF的HelloWorld”示例中复制代码,地址为https://mozilla.github.io/pdf.js/examples/。.PDF倒置并镜像。我环顾四周,一个常见的原因是重复使用Canvas进行多次渲染,但我没有这样做,我只是渲染一次,所以我真的不知道。在我的html文档的顶部,我有:$html.='';然后我基本上像这样从演示中完全复制了JS(encodedString变量是我的pdfbase64字符串)varpdfData=atob(encodedString);//Loa

javascript - 检查整个 div 是否对用户可见

有没有办法检查div是否对用户完全可见?我的意思是滚动条的位置使整个div都适合视口(viewport)。 最佳答案 这正是创建它的目的:http://www.appelsiini.net/projects/viewport 关于javascript-检查整个div是否对用户可见,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/8595857/

javascript - 将 jquery 选择器转换为数组

我需要能够将当前选择器存储在当前视口(viewport)中,然后在10秒后检查它们是否仍在用户当前视口(viewport)中。我的解决方案是将选择器存储在一个数组中,然后在10秒内将旧选择器与新选择器进行比较,看看是否匹配。如果他们这样做...做点什么。所以我相信使用.each并构建数组,除非有人对此有更优雅的解决方案?$('.gridContainers:in-viewport')这将返回一个标准的选择器。 最佳答案 调用$(selector)返回一个类似数组的jQuery对象,而不是一个实际的JavaScript数组,尽管出于他

javascript - div 水平进入视口(viewport)时的动画

我正在创建一个无限水平进给,我想在元素水平进入视口(viewport)时为元素设置动画。我正在为此尝试使用waypoint.js。JSFIDDLE1234将.show添加到div,这会将div的不透明度从0更改为1。$(function(){$(".item").each(function(){$(this).waypoint(function(){$(this).addClass('show');},{offset:'100%',horizontal:true});});});CSS.item{width:500px;height:250px;background:red;color

javascript - 在 iPhone 网络应用程序上捏/缩放后如何获得视口(viewport)比例?

有谁知道如何在用户捏合或双击以放大/缩小JavaScript页面后获取视口(viewport)的大小(以像素为单位)或比例值?我尝试过使用window.innerWidth,但结果好坏参半。有时它似乎准确地给出了视口(viewport)显示的像素数,但是,如果我在页面上放大然后做一个大的捏来缩小,window.innerWidth将在600-700左右,即使它只是显示页面的~200px。该页面只有400像素宽,并且没有显示当您缩小到超过页面大小时看到的方格背景“您做得太过分了”。如果我稍微捏一下来放大和缩小,window.innerWidth似乎工作得很好。不幸的是,我不能指望用户只做

javascript - 在全局/根坐标中确定 SVG 视口(viewport)

在SVG元素中实际可见的内容取决于它的纵横比,它的viewBox值,及其preserveAspectRatio值(value)。例如,具有相同viewBox值(下方红色虚线)的相同SVG元素大小可以根据preserveAspectRatio具有不同视口(viewport)(下方蓝色部分):Chrome有一个viewport属性,但在我的使用中它始终是一个空的(全部为0值)SVGRect。Firefox不实现此属性。svg.getBBox()方法返回viewBox的值,而不是实际可见的视口(viewport)内容。给定对SVG元素的引用,我如何才能最轻松地确定可见内容(视口(viewpo

JavaScript 游戏视口(viewport)

您好,我是JavaScript的新手,因此决定按照w3schoolsgametutorial了解更多信息.我决定让它成为一款平台游戏,但我一直无法弄清楚如何在Canvas外添加跟随玩家的视口(viewport)。谁能帮帮我?提前致谢。Fiddle//BackgroundvarBackground;//ObjectsvarPlayer;varObstacle;//MobilebuttonsvarUpBtn;varDownBtn;varLeftBtn;varRightBtn;//EndfunctionstartGame(){Background=newcomponent(656,270,"

javascript - Vue.js 过渡出现/发生在进入视口(viewport)的元素上

首先请不要使用jQuery。我可以在jQuery等中做到这一点,问题的重点是在没有不必要的依赖的情况下做到这一点。这里的场景是我正在创建一个单页网站,其中有几个部分可供滚动浏览。我想用Vue.js'stransitions在浏览器滚动到该部分后简单地淡入。我已经设法使转换与appearattribute一起工作但问题是这个初始渲染触发器适用于屏幕外的元素,我想推迟该触发器,直到浏览器在屏幕上滚动该元素。我找到了像vue-observe-visibility这样的图书馆这可以满足我的需要,但老实说,我不想简单地为触发器创建大量数据属性,以将其更改为true,以便v-if语句触发淡入淡出效