Make highlighting text difficulty level work.
parent
e4f870c995
commit
6d15b65e3c
|
@ -65,7 +65,7 @@
|
||||||
<p><b>阅读文章并回答问题</b></p>
|
<p><b>阅读文章并回答问题</b></p>
|
||||||
<div id="text-content">
|
<div id="text-content">
|
||||||
<div id="found">
|
<div id="found">
|
||||||
<div class="alert alert-success" role="alert">According to your word list, your level is <span class="badge bg-success" id="user-level">{{ today_article["user_level"] }}</span> and we have chosen an article with a difficulty level of <span class="badge bg-success" id="text_level">{{ today_article["text_level"] }}</span> for you.</div>
|
<div class="alert alert-success" role="alert">According to your word list, your level is <span class="text-decoration-underline" id="user-level">{{ today_article["user_level"] }}</span> and we have chosen an article with a difficulty level of <span class="text-decoration-underline" id="text_level">{{ today_article["text_level"] }}</span> for you.</div>
|
||||||
<p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/>
|
<p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/>
|
||||||
<div class="p-3 mb-2 bg-light text-dark" style="margin: 0 0.5%;"><br/>
|
<div class="p-3 mb-2 bg-light text-dark" style="margin: 0 0.5%;"><br/>
|
||||||
<p class="display-6" id="article_title">{{ today_article["article_title"] }}</p><br/>
|
<p class="display-6" id="article_title">{{ today_article["article_title"] }}</p><br/>
|
||||||
|
@ -202,9 +202,8 @@
|
||||||
$('#source').html(today_article['source']);
|
$('#source').html(today_article['source']);
|
||||||
$('#question').html(today_article["question"]);
|
$('#question').html(today_article["question"]);
|
||||||
$('#answer').html(today_article["answer"]);
|
$('#answer').html(today_article["answer"]);
|
||||||
document.querySelector('#text_level').classList.add('display-5'); // enlarge text difficult level for one second
|
document.querySelector('#text_level').classList.add('mark'); // highlight text difficult level for 2 seconds
|
||||||
|
setTimeout(() => {document.querySelector('#text_level').classList.remove('mark');}, 2000);
|
||||||
setTimeout(() => document.querySelector('#text_level').classList.remove('display-5'), 800);
|
|
||||||
}
|
}
|
||||||
<!-- 检查是否存在上一篇或下一篇,不存在则对应按钮隐藏-->
|
<!-- 检查是否存在上一篇或下一篇,不存在则对应按钮隐藏-->
|
||||||
function check_pre(visited_articles){
|
function check_pre(visited_articles){
|
||||||
|
|
Loading…
Reference in New Issue