时间戳

首页 > 解决方案 > Adobe Captivate - 拖放

drag-and-drop - Adobe Captivate - 拖放

问题描述

我正在使用 Adob​​e Captivate 制作在线学习活动，我们正在使用效果很好的拖放。唯一的问题是它不是动态的，因此一旦学生正确，他们就可以按照位置再次正确。是否可以打乱拖放对象的位置，以表明学生对问题的理解，而不仅仅是遵循记住的模式。

标签： drag-and-dropadobe-captivate

解决方案

不是开箱即用。没有像多选答案那样的“随机拖动源”复选框。通过将此脚本放入您的 OnEnter 操作并选择“执行 Javascript”，可以实现您所要求的功能：

$(function () {
  var dss = cp.DD.CurrInteractionManager.m_ActiveInteraction.m_dsList;
  var ypos = dss.map((i) => {
    return $("div[id='" + i.n + "']").css("top");
  });
  ypos = shuffle(ypos);
  dss.forEach((o, i) => {
    $("div[id='re-" + o.n + "c']").css("top", ypos[i]);
    $("div[id='" + o.n + "']").css("top", ypos[i]);
  });
  function shuffle(arr) {
    for (var i = 0; i < arr.length; i++) {
      var randId = Math.floor(Math.random() * arr.length);
      var tmp = arr[i];
      arr[i] = arr[randId];
      arr[randId] = tmp;
    }
    return arr;
  }
});

我没有出于复制/粘贴的目的在此处添加注释，因为那个糟糕的 Captivate JavaScript 窗口带有空白，因此这里是逐句演练的语句：

var dss = cp.DD.CurrInteractionManager.m_ActiveInteraction.m_dsList;

将所有拖动源收集到一个数组中。

var ypos = dss.map((i) => {return $("div[id='" + i.n + "']").css("top")});

提取每个对象的 Y 位置。

ypos = shuffle(ypos);

调用函数（定义如下）随机打乱 Y 位置数组的顺序。

dss.forEach((o, i) => {$("div[id='re-" + o.n + "c']").css("top", ypos[i]);
$("div[id='" + o.n + "']").css("top", ypos[i]);});

循环通过拖拽源并将每个拖拽源放置到新位置，同时将画布带上。

这里有几个警告。

  • 如果允许多次尝试，“重置”按钮会将拖动源放回其原始位置。
  • 这假设拖动源都以相同的水平位置排列。如果它们分散在各处，则还需要考虑 X 位置。
  • 我没有在响应式或弹性项目上对此进行测试，我不确定 Adob​​e 在这些情况下如何为对象定位，这将适用于固定大小的项目。
  • IE11 可能不支持箭头函数，如果需要支持，可能需要使用传统语法重新编写回调函数。

推荐阅读