28 January 2014

Anki :: dynamic styles

В шаблонах карточек можно использовать скрипты JavaScript для создания интересных эффектов. Например, можно произвольным, случайным, образом менять шрифт вопроса. Это может быть особенно полезно для арабской письменности, как в прочем и для любой другой непривычной. Я буду показывать на примере армянского языка.



В разделе стилей создается несколько вариантов оформления:
.f1 { font-family: sylfaen; font-size: 20px; }
.f2 { font-family: tahoma;  font-size: 17px; }
.f3 { font-family: norkirk; font-size: 24px; }

Далее в шаблоне лицевой стороны поле с вопросом оформляется тэгами div с идентификатором (question), указывается стиль по-умолчанию (f1). Ниже, в том же шаблоне лицевой стороны, пишется скрипт, который ищет поле по идентификатору и меняет аттрибут стиля на случайный.
<a class="f1" id="question">{{Word Armenian}}</a>

<script>
  var el = document.getElementById('question');
  var rand_style = Math.ceil(3 * Math.random());
  el.getAttributeNode('class').value = 'f' + rand_style;
</script>

Применительно к армянскому языку буквы его алфавита довольно сильно различаются в строчном и прописном начертании: Զզ, Հհ, Պպ. Поэтому для запоминания можно в шаблоне вопроса иногда менять регистр букв на заглавные.
<a id="question">{{Word Armenian}}</a>

<script>
  var el = document.getElementById('question');
  if (Math.random() > 0.5)
    el.innerHTML = el.innerHTML.toUpperCase();
</script>

Примечание: в тэгах <script> не нужно указывать аттрибут type="text/javascript", иначе код будет проигнорирован.

No comments:

Post a Comment