Question

我正在通过AJAX将项目推送到数组，并将每个项目渲染到具有淡入过渡的DOM中。这是public static string RenderToString(this PartialViewResult partialView) { var httpContext = HttpContext.Current; if (httpContext == null) { throw new NotSupportedException("An HTTP context is required to render the partial view to a string"); } var controllerName = httpContext.Request.RequestContext.RouteData.Values["controller"].ToString(); var controller = (ControllerBase)ControllerBuilder.Current.GetControllerFactory().CreateController(httpContext.Request.RequestContext, controllerName); var controllerContext = new ControllerContext(httpContext.Request.RequestContext, controller); var view = ViewEngines.Engines.FindPartialView(controllerContext, partialView.ViewName).View; var sb = new StringBuilder(); using (var sw = new StringWriter(sb)) { using (var tw = new HtmlTextWriter(sw)) { view.Render(new ViewContext(controllerContext, view, partialView.ViewData, partialView.TempData, tw), tw); } } return sb.ToString(); }我写的，为每个后续项添加一个很好的延迟：

SASS

这可以按预期工作，但问题是，我一次对项目6进行分页。这意味着在第一次获取6时，所有转换都按预期进行，但是当我获取下一个6而不是立即渲染时，它们会受到@for $i from 1 through 100 { .album:nth-of-type(#{$i}) { transition-delay: $i * 0.15s; } }增量的影响。

正在寻找的是transition-delay逻辑，它基本上会为每个第6个实例/子项重置SASS增量。我该如何做到这一点？

Answer 1

有效地实现同样的目标，只有6个生成的规则。 CSS逻辑，而不是SASS！

@for $i from 1 through 6 {
  .album:nth-of-type(6n + #{$i}) {
     transition-delay: $i * 0.15s;
  }
}

Sass过渡延迟循环？

1 个答案: