[Slider Revolution 6] 使用新的[模态]功能将任何Slider加载到另一个

[Slider Revolution 6] Load any Slider into another with the new "Modal" FeatureSlider Revolution
这篇文章约3分阅读完。
  1. 使用新的“模态”功能将任何Slider加载到另一个
    1. 内容:
    2. 1.模态滑块
      1. 准备好滑块后,选择将其作为模态加载到页面中时应如何显示。
      2. 接下来,添加一个“ Close Modal”按钮,以允许用户退出已加载的内容。在此示例中,我们将添加一个简单的图标层
      3. 然后在编辑阶段选择“图层”,然后单击“图层动作”图标。
      4. 然后在“动作”面板中,滚动到“幻灯片动作”部分,然后选择“关闭滑块模式”。
      5. 然后,您将在列表中看到“操作”。此时,关闭面板,保存Slider,然后继续执行步骤2!
    3. 2.您的主滑块
      1. 首先,在编辑阶段添加一个图层。它可以是任何类型的图层,但是在此示例中,我们将使用传统的Button。
      2. 接下来,在编辑阶段选择“按钮”,然后单击“操作”图标以设置模式链接。
      3. 然后从“幻灯片操作”部分中,选择“打开滑块模式”。
      4. 最后,选择要加载到Modal中的Slider的名称,还可以从该Slider中选择要加载的特定Slide。
    4. 3.网页设置
      1. 只将主滑块添加到您的网页!
    5. 4. HTML链接或JavaScript
      1. 首先,从页面块中选择“滑块革命”以选择滑块。
      2. 然后启用右上角的“将滑块添加为模态”按钮,然后单击“ +”图标以添加滑块。
      3. 接下来,编辑以下HTML,将“ slider-alias-here”替换为Slider’s Alias。(在复制/粘贴后重新输入双引号和单引号)。
      4. 然后将此链接添加到页面内容中的某处。

使用新的“模态”功能将任何Slider加载到另一个

新的“模态功能”使您可以通过单击按钮按需显示滑块。这可以通过在另一个Slider中设置“操作”,或者通过HTML链接或JavaScript来完成。

内容:

  1. 模态滑块
  2. 主滑块
  3. 网页设置
  4. 自定义HTML链接(无需主滑块)
  • 相关话题
  • 图层动作
  • 新模块
  • 添加到网页

1.模态滑块

模态滑块与其他任何滑块相同,只不过它们仅通过用户交互按需显示。在此示例中,我们将设置“关闭”按钮,并选择模态应如何显示。

准备好滑块后,选择将其作为模态加载到页面中时应如何显示。

使用“位置”选项(1)为内容设置对齐方式,然后选择是否在内容后面放置传统的彩色背景(2/3)。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

接下来,添加一个“ Close Modal”按钮,以允许用户退出已加载的内容。在此示例中,我们将添加一个简单的图标层

[Slider Revolution 6]使用新的将任何Slider加载到另一个

然后在编辑阶段选择“图层”,然后单击“图层动作”图标。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

然后在“动作”面板中,滚动到“幻灯片动作”部分,然后选择“关闭滑块模式”。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

然后,您将在列表中看到“操作”。此时,关闭面板,保存Slider,然后继续执行步骤2!

[Slider Revolution 6]使用新的将任何Slider加载到另一个

2.您的主滑块

默认情况下,我们的主滑块就是我们将在页面上显示的内容。然后,在此Slider内,我们将创建一个特殊按钮以打开Modal Slider。

首先,在编辑阶段添加一个图层。它可以是任何类型的图层,但是在此示例中,我们将使用传统的Button。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

接下来,在编辑阶段选择“按钮”,然后单击“操作”图标以设置模式链接。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

然后从“幻灯片操作”部分中,选择“打开滑块模式”。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

最后,选择要加载到Modal中的Slider的名称,还可以从该Slider中选择要加载的特定Slide。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

3.网页设置

只将主滑块添加到您的网页!

如果您已按照上面的步骤#1和#2进行操作,则只需将Main Slider添加到页面中,因为Modal Slider将通过Ajax按需加载。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

 

4. HTML链接或JavaScript

要从简单的HTML链接加载Slider,首先我们需要在页面上嵌入“ Modal Slider”。默认情况下,它将被隐藏,然后在单击自定义链接时显示。

一个简单的简码公式就是在滑块的简码中包含用法=“ modal”。但是,使用简码向导,我们可以自动进行设置。

首先,从页面块中选择“滑块革命”以选择滑块。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

然后启用右上角的“将滑块添加为模态”按钮,然后单击“ +”图标以添加滑块。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

接下来,编辑以下HTML,将“ slider-alias-here”替换为Slider’s Alias。(在复制/粘贴后重新输入双引号和单引号)。

<a href=”#” onclick=”document.dispatchEvent(newEvent(‘RS_OPENMODAL_slider-alias-here’));返回false”>打开模式滑块!</a>

然后将此链接添加到页面内容中的某处。

#1是自定义HTML块,而#2中的图标表示“模块滑块”块,该块默认情况下将隐藏,并且仅在用户交互时加载。

[Slider Revolution 6]使用新的将任何Slider加载到另一个

评论

复制标题和 URL