jjzjj

Transform

全部标签

javascript - 找不到兼容版本 : babel-plugin-transform-decorators@^6. 13.0

很明显,当我运行npminstall时,突然出现以下错误:npmERR!Nocompatibleversionfound:babel-plugin-transform-decorators@^6.13.0npmERR!Validinstalltargets:npmERR!6.8.0,6.6.5,6.6.4,6.6.0,6.5.0,6.5.0-1,6.4.0,6.3.13,6.2.4,6.1.18,6.1.17,6.1.10,6.1.5,6.1.4,6.0.14,6.0.2我在package.json中有以下依赖项。我已经尝试将babel包更新到最新版本,以及安装babel-plugin

javascript - 使用 JavaScript 事件处理程序和函数的 CSS3 转换不会在 Firefox 中触发

我已经建立了一个多月的画廊,布局很简单,左边是缩略图菜单,右边是画廊预览。当您单击已加载的缩略图时,它会触发一个mousdown事件,该事件会折叠缩略图区域并将画廊预览扩展到完整大小(全部使用CSS3转换)。到目前为止,一切正常,除了我创建了一个omouseover事件,当您将鼠标悬停在缩略图上时该事件会激活该功能。该函数重绘图库预览div(“图片”)的内容并创建三张图像,两张是帧中的上一张图像,一张是帧中的下一张图像(在中心)。在innerHTML中,它将CSS样式“left:”设置为724px或-724px,具体取决于它是向前还是向后。然后当生成所有这些html的函数完成时,负责监

javascript - 缩放页面时 Firefox 输入问题

我正在使用transform:scale(0.666667);transform-origin:25.7778%00;css以使页面适合我元素中的任何类型的屏幕尺寸。之后我面临以下问题!当我双击输入电子邮件时出现在其他地方 最佳答案 我不确定您是否想使用转换来创建响应式设计。您可以使用%来缩放您的设计以适应任何屏幕。据我了解,转换仍处于实验阶段,尚未为生产环境做好充分准备。我认为问题在于下拉列表的起源是继承css并重新应用它。https://developer.mozilla.org/en-US/docs/Web/CSS/trans

javascript - 如何更改拉斐尔图标的大小?

如何从免费的Raphael图标更改图标的宽度和高度?我尝试使用attr,尝试使用%,像这样varpaper=Raphael("canvas",100%,100%);.我需要这样做:如果我更改父block的大小,我的图标的大小也会更改。upd:我尝试使用“scale”和“transform”,但图标从中心调整大小并且不能正确适应父级 最佳答案 根据Raphael.js文档varel=paper.rect(10,20,300,200);//translate100,100,rotate45°,translate-100,0el.tran

javascript - Chrome 在具有边框半径的缩放元素内搞乱图像

用例我正在尝试构建“幻灯片放映”类型的应用程序。每张幻灯片都有固定的宽高比,但我希望内容以其正常的宽度/高度呈现-所以我试图在幻灯片的内容上使用CSS3“transform:scale”,使用视口(viewport)宽度/高度我计算理想的比例/边距以使幻灯片适合视口(viewport)。在一张特定的幻灯片上,我为人们展示了一些“信息卡”和每个人的“继任者”列表问题Chrome在图像上显示出一些非常奇怪的行为。如果您调整窗口大小,图像会到处移动。如果您强制图像以某种方式重新绘制图像似乎会自行修复(即向下滚动页面并返回)编辑这似乎与边框半径框内的图像特别相关!问题这是Chrome中的错误吗

javascript - 避免使用 svg 图像进行光栅化,以便在 Firefox 中进行转换

我想申请matrixtransformsvg.Here'safiddle.在Firefox上,它看起来像这样:由于我的View框,它看起来像是在转换之前将其光栅化为10x10位图。我怎样才能避免这种情况?在我看来,我可以尝试找到一种方法来强制Firefox不进行光栅化,或者使用某种形式的嵌入。(??iframe?出于某种原因,我认为这些都是不好的做法。)我正在使用JavaScript动态加载这些SVG。那我该怎么做呢?PS:如果有办法用svg.js,这就是我现在正在使用的,但我非常愿意使用Vanilla来让它工作。编辑:FWIW,显然它已在每晚的Firefox中修复,但我现在仍然想要一

javascript - 为什么我的转换 : translateY flicker in Chrome?

我有一个简单的多列布局;我正在尝试使用translateY在:hover上提升一个元素。它会导致闪烁(在Chrome57上测试过)。我该如何解决这个问题?"usestrict";$(function(){var$target=$('.wall');functiongetImageUrl(id){varwidth=500;varheight=250+Math.floor(Math.random()*150);return"https://unsplash.it/"+width+"/"+height+"?image="+id;}functionaddElement(element){var

javascript - 无法将树视为水平

我想水平创建树。我得到一个链接http://codepen.io/Pestov/pen/BLpgm但它不是水平的。我尝试更改css但无法获得预期的View。谁能告诉我我该怎么做才能将树视为水平的。根从左开始。我想要下图的css..它应该是动态的。好像删除了节点然后它应该调整边缘。 最佳答案 一种方法是旋转.tree,然后调整top和left属性以根据需要定位树。已编辑:将此添加到您的CSS:.tree{position:absolute;top:50px;left:-50px;transform:rotate(-90deg);-we

javascript - iPhone OS 3.0 中使用 webkit-transform translate() 的慢速动画

iPhoneOS3.0中的JavaScript处理有什么变化吗?此代码适用于Safari4PublicBeta和iPodTouch2.0,但不适用于装有iPhoneOS3.0的iPodtouch。目的是在2秒内将框向右移动一点,但在3.0中它只是跳到新位置,没有动画或延迟。iPhoneJStesting.box{position:absolute;width:150px;height:150px;background-color:red;-webkit-transition-property:-webkit-transform;-webkit-transition-duration:2

javascript - D3 v4 获取元素的翻译值

这个问题在这里已经有了答案:Howcand3.transformbeusedind3v4?(6个答案)关闭6年前。当我在一个元素上运行d3.select(this).attr("transform")时,我得到一个响应translate(20.00,778)。但是我需要获取翻译的各个值。在v3中,可以使用vart=d3.transform(element.attr("transform"));t.translate;但是d3.transform在v4中不可用。如何达到同等效果?