草庐IT

Transition

全部标签

javascript - 在 iPad 上使用 javascript 更改 webkit 过渡持续时间?

我在iPad应用程序中使用web-kit转换。他们工作得很好。但我想知道如何使用javascript更改转换的值。#container{-webkit-transition-property:-webkit-transform;-webkit-transition-duration:1s;-webkit-transition-timing-function:ease-out;}我想做什么:functionfunc(){document.getElemeentById('container').transition.duration=500;}这可能吗? 最佳

javascript - 使用汇总将 d3.event 导入自定义构建

我有一个这样的文件d3.custom.build.js(简化):import{range}from'd3-array';import{select,selectAll,event}from'd3-selection';import{transition}from'd3-transition';exportdefault{range,select,selectAll,event,transition};还有一个像这样的rollup.config.js:importnodeResolvefrom'rollup-plugin-node-resolve';exportdefault{entry

javascript - CSS3 + Javascript - 将 -ms-transition :opacity 1s ease-in-out; work in IE 10 alone?

我今天一直在玩弄一些CSS3+JavaScript。下面是我的代码,(正在尝试制作世界上最小的图像褪色画廊,不知道我是否成功)。虽然我不太确定如何设置CSS。请参阅下面的评论问题:-ms-transition:opacity1sease-in-out;//WillthisalloneworkinIE10?transition:opacity1sease-in-out;//Whydowesetthis?也许是世界上最小的JS-Gallery:HB-CSS3+JSGallerybody{margin:0;text-align:center;font:200px/500pxgeorgia}#

javascript - Bootstrap 轮播在 css 调整后拒绝平滑过渡

在过去的3个小时里,我一直在尝试对Bootstrap3的轮播过渡进行简单的调整。我试过更改幻灯片速度,这是唯一似乎有任何效果的东西:.carousel-inner.item{-webkit-transition-duration:2s;-moz-transition-duration:2s;-o-transition-duration:2s;transition-duration:2s;}但它过早地隐藏了“离开”的内容,我不知道要修改什么属性来解决这个问题。我也试过用将其更改为淡入淡出过渡.carousel-fade.item{opacity:0;-webkit-transition:

javascript - 从元素中删除类而不影响正在进行的 css 转换

好的,我有一种情况,我基本上构建了一个小的通知下拉框,当用户做某事时发生,最后它转换为opacity:0;状态。但是,由于用户可能会单击其他会再次触发此通知框的内容,因此我试图想出一种方法将其重置为正常状态,而不会影响任何正在进行的转换,并尝试使动画由CSS而不是JavaScript完成.代码笔:http://codepen.io/gutterboy/pen/WoEydgHTML:OpenNotifyWindowSCSS:body{text-align:center;padding-top:150px;}.top-notify{position:fixed;top:0;width:10

javascript - React Router 无法获取/依赖于 onEnter 函数

我是React的新手,希望有人能阐明为什么会发生这种情况以及如何调试它。我定义了以下路由:exportdefault(withHistory,onUpdate)=>{consthistory=withHistory?(Modernizr.history?newBrowserHistory:newHashHistory):null;return();};requireAuth应该检查用户是否已登录,如果没有则将他们重定向到登录页面:functionrequireAuth(nextState,transition){transition.to("/login");}如果我离开transti

javascript - ionic : ng-show and page transition

我正在使用Ionic开发移动应用程序,但我还不是很熟悉这个框架或Angular。您可以点击一些列表项以查看包含一些详细信息的页面。这是我的列表模板:{{location.name}}Controller:...$scope.showDetails=function(location){$rootScope.currentLocationDetails=location;};...这是详细信息页面:Controller:app.controller('DetailsController',function($scope,$rootScope){$scope.location=$rootS

javascript - 悬停时颜色变为灰度在 IE11 中不起作用

我正在使用Gray对于网站上的一些元素。但是,我无法让它在IE11中工作。例如,在下面的fiddle中,我使用JS添加了grayscale和grayscale-fade类,以便图像在悬停时从彩色渐变为灰度。我如何让它在IE11中工作?作者说该插件需要针对IE11进行初始化(即$('article.projectimg').gray();),但是如果我添加该行,所有图像都会变灰默认从一开始。我只是想让它在IE11中工作。有人可以告诉我怎么做吗?fiddle:http://jsfiddle.net/61jcam54/HTMLProjectTitle+CSSarticle.project{f

javascript - 元素值在使用 react-transition-group 转换之前移动和更改

我在使用react-transition-group时注意到了这种行为打包在我正在处理的gatsby项目中。我有一个“标签”列表,当它们是从另一个主列表中挑选出来时,它们被添加到一个事件列表中。单击主列表中的标签将其添加到事件列表中,单击事件列表中的标签将其删除。几乎与您期望的类似工作方式一样。转换in工作得很好,但是当转换out时,标签以一种奇怪的方式重新组织自己。我们有五个具有以下值的标签:不含乳制品派对食品家庭规模低胆固醇低钠如果您单击FamilySized标记将其删除,会发生以下情况:FamilySized立即消失LowCholesterol和LowSodium立即向左移动最后

javascript - CSS @media 查询(和其他嵌套选择器)的正则表达式解析

我正在开发一个Node脚本,它使用正则表达式来解析CSS文件,并且它工作得很好......除了处理@media查询时。问题是由于嵌套的花括号让我很不舒服。我基本上想创建一个媒体查询中所有内容的捕获组:这是我到目前为止所获得的内容。@media[^{]+\{([^}]+)}\s*}这适用于一些简单的事情,例如:@media(max-width:868px){aside.size-toggle{display:none;}}但是不能拾取多个嵌套规则,像这样:@media(max-width:767px){#wrapper.sidebar-displayaside{left:0;transi