gpt4 book ai didi

css - 每次在 Meteor 中渲染时脉冲模板

转载 作者:技术小花猫 更新时间:2023-10-29 11:23:07 26 4
gpt4 key购买 nike

我希望每个模板在每次渲染时都有脉冲。有一个可视化调试工具来查看正在渲染的内容。所以我想象类似的东西,当一个模板(一小段)被渲染时,它的背景颜色被设置为红色,然后这种红色慢慢地淡入原始背景颜色或任何背景(即使它是透明的)。所以如果我看到某个东西一直是红色的,我就知道它一直在重绘。

最佳答案

基于@Hubert OG 的代码和 this blog post 的想法,我为Meteor渲染做了如下调试代码:

pulseNode = (i, node) ->
return unless node.style

$node = $(node)
prePulseCss = $node.data('prePulseCss') ? node.style.cssText
prePulseBackgroundColor = $node.data('prePulseBackgroundColor') ? $node.css('backgroundColor')
$node.data(
'prePulseCss': prePulseCss
'prePulseBackgroundColor': prePulseBackgroundColor
).css('backgroundColor', 'rgba(255,0,0,0.5)').stop('pulseQueue', true).animate(
backgroundColor: prePulseBackgroundColor
,
duration: 'slow'
queue: 'pulseQueue'
done: (animation, jumpedToEnd) ->
node.style.cssText = prePulseCss
).dequeue 'pulseQueue'

pulse = (template) ->
$(template.firstNode).nextUntil(template.lastNode).addBack().add(template.lastNode).each pulseNode

_.each Template, (template, name) ->
oldRendered = template.rendered
counter = 0

template.rendered = (args...) ->
console.debug name, "render count: #{ ++counter }"
oldRendered.apply @, args if oldRendered
pulse @

关于css - 每次在 Meteor 中渲染时脉冲模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17697314/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com