im体育的平台下载帮助中心

工具提示、弹出窗口和模态窗口

工具提示、弹出窗口和模式窗口非常适合澄清某些单词或在上下文中显示其他信息,而不会出现太多文本或一次占用太多屏幕空间。

您可以在调查和ReportBuilder元素中im体育官app使用工具提示、弹出窗口和模式窗口。它们不能用于电子邮件。

im体育官app使用哪一个?

  • 工具提示:当受访者悬停在一个词或图标上时,im体育官app使用工具提示向他们显示简短的文本
  • 弹出框:im体育官app使用弹出框显示较长的文本,或者当您想要链接到外部网页时。它会在受访者单击单词或图标时显示。窗口保持可见,直到他们在弹出窗口外再次单击。
  • 模态窗口:im体育官app使用模态窗口显示长文本、图像和链接。这会创建一个覆盖大部分屏幕的叠加层。背景变暗,以便焦点位于窗口上。受访者单击右上角或模式窗口外部的 X 将其关闭。

句法

您可以通过im体育官app使用以下语法向文本添加一些 CSL 来创建所有三个元素。

  • 运算符:确定您要im体育官app使用的内容:工具提示、弹出窗口或模态窗口。
  • 活动文本:这是对悬停或单击做出反应的文本。如果只想显示图标,请将双引号之间的空格留空。
  • 内容:这是将显示在工具提示、弹出窗口或模式窗口中的内容。
  • 位置 (可选) :im体育官app使用位置来确定必须显示内容的位置(仅适用于工具提示和弹出窗口)。
  • 图标 (可选) :将图标显示为触发器而不是文本。

如何添加?

1.im体育官app使用下拉菜单

im体育官app使用编辑器中的变量下拉菜单插入工具提示、弹出窗口或模态窗口:

  1. 将光标放在您希望元素出现的位置。
  2. 单击变量按钮。
  3. 从下拉菜单中选择TooltipPopoverModal window

注意:下拉菜单中的所有项目均按字母顺序排列,因此顺序可能与此动画不同。

2.自己输入CSL

  1. CSL 代码以两个大括号{{
  2. 键入运算符(工具提示、弹出窗口或模式)。
  3. 在将触发该元素的双引号之间键入您的活动文本。
    例如点击这里
  4. 添加一个空格。
  5. 在双引号之间键入内容。
  6. 可选地添加一个位置。
  7. (可选)添加图标类。
  8. 用两个大括号}}关闭 CSL 代码。

例子:

{{tooltip "more info" "I am a tooltip." position="top"}}
{{tooltip "" "I am a tooltip triggered by an icon" position="top" icon="fas fa-info-circle"}}
{{popover "click here" "content" position="right" icon="fas fa-star"}}
{{#modal "click here"}}You can add more text here. Quotes, new lines and extra variables are all possible.{{/modal}}

im体育官app使用图标作为触发器

要im体育官app使用图标触发工具提示、弹出窗口或模式窗口,请添加一个额外参数,如上面的语法所示。

添加Font Awesome 类以显示您想要的图标。

下面的代码将显示一个信息圈。请注意,“活动文本”现在是空的。这样只会显示图标。

{{operator "" "contents" icon="fas fa-info-circle"}}

下面的代码将在其旁边显示一些文本一个信息圆圈图标。

{{operator "active text" "contents" icon="fas fa-question-circle"}}

im体育官app使用动态内容

调查模式窗口

这里有一个非常方便的提示:如果您要在模态窗口中显示的内容很长或有很多格式或图像,请将内容放在隐藏的文本/媒体元素中,而不是尝试将其直接键入到 CSL 代码中。然后im体育官app使用变量在模态窗口中显示内容。

按照以下步骤将动态内容添加到模态窗口:

    1. 文本/媒体问题添加到您的调查中并将其隐藏
    2. 在此处键入您希望在模态窗口中显示的文本。
    3. 转到“设置”选项卡并添加数据标签
      在下面的示例中,im体育im体育官app使用了“ text1”
    4. 单击保存
    5. 现在,您可以在任何其他调查页面的模式窗口中显示此文本,甚至可以通过im体育官app使用变量引用文本/媒体问题的数据标签在 ReportBuilder 元素中显示此文本。像这样:
      Click {{modal "here" survey.questions.text1}} for more information.
      

这种方法将使您的 CSL 代码保持整洁并使翻译更容易!

还有另一种在模态窗口、工具提示和弹出窗口中im体育官app使用较长文本的方法。
您可以im体育官app使用语法。下面是几个例子:

{{#modal "Click here"}} This text can be longer and contain markup, quotes and variables. {{/modal}}
{{#tooltip "Click here"}} This text can be longer and contain markup, quotes and variables. {{/tooltip}}
{{#popover "Click here" position="right" icon="far fa-star"}} This text can be longer and contain markup, quotes and variables. {{/popover}}

留下一个回复

您的电子邮件地址不会被公开。