Greenshift交互面板允许您进行自定义交互并构建您自己的功能，这些功能不能作为块使用。
您可以在大多数核心 Greenshift 块以及查询插件的一些高级块中的“高级 – 交互层”面板中找到它。
交互层背后的想法很简单——你有触发器和动作。您可以添加无限的层（触发器）并将无限的操作附加到触发器。
默认情况下，触发器和操作将用于添加交互层的当前块，但您也可以使用自定义 CSS 选择器从站点获取数据，为此，您可以单击自定义选择器按钮（可用于触发器和操作）
Greenshift 在底层使用 .querySelectorAll。因此，如果您将选择器添加为类，例如“.trigger”，则插件将使用页面上类为 .trigger 的所有元素，并向每个元素添加操作。
编辑器执行
默认情况下，由于工具栏和面板的编辑器中存在大量事件和附加层，脚本将仅在前端部分执行。但您也可以通过单击“触发器”附近的“电源”按钮在编辑器中使用它。
我们仍然建议在前端部分测试它的最终工作，但简单的脚本在编辑器和前端中的工作方式相同。
延迟选项
脚本的触发器执行可能会有一些延迟。您需要单击触发器附近的时间图标进行设置。
动态占位符
在某些触发器中，例如滚动触发器，您还可以在操作中使用动态占位符和计算。您需要单击齿轮图标才能查看所有可用的动态占位符。
动态占位符根据特定触发器添加动态值。例如，如果您使用滚动触发器，它将把滚动距离放入值中。这样就可以基于Scroll制作自定义的动画效果了。
动态占位符还支持自定义选择器。例如，当您使用 {{WIDTH}} 占位符时，它将采用您添加操作的当前元素的宽度，但您可能想从另一个元素获取宽度，为此，请单击地图图标并放置自定义唯一选择器
对于简单的滚动插值效果，使用 GSAP 库和滚动插值选项会更高效，您可以在“高级 – 动画”面板中找到该选项
值的数学运算
当您在属性或 CSS 属性中设置值时，您还可以进行数学运算。例如，您可以获取当前元素的宽度并将其添加到另一个元素的宽度，您可以通过单击数学按钮来完成此操作
动态选择器
有几种使用动态选择器的方法。当页面上有多个项目但您只需要使用基于自定义 JavaScript 函数的特定项目时，它们会很有用。
目前，有两种基本方法可以做到这一点：
触发索引选择器
您可以通过在操作的选择器字段中添加占位符 {TRIGGERINDEX} 来使用它。它还可以在 CSS 选择器生成器中使用（单击自定义选择器字段中的齿轮图标将其打开）
触发索引将根据触发元素在同级元素中的顺序自动计算。例如，如果您有一个容器，并且容器中有 3 个按钮，则触发器索引将获取容器内按钮的顺序。如果您想将操作添加到相关操作项，这会很有用。在这种情况下，我们的代码将应用于具有类 test 且与触发器具有相同顺序的元素。此场景对于制作选项卡或图库很有用
以最近的元素设置限制
想象一下这样的情况，当您有几个相似的对时，例如，有标题和答案块的手风琴。并且您希望在单击标题时建立交互，仅打开标题下方的答案块，而不是页面上的所有答案块。在这种情况下，您需要通过最接近的选项进行限制，以便插件将获取最接近的父级，然后在其中搜索元素而不是使用所有元素
自定义选择器的语法示例
{CLOSEST:.parent}{SELECTOR_ALL:.test}
这种语法意味着插件将尝试获取最接近的具有“parent”类的父级，然后找到具有“test”类的选择器。
