mai
/
posimai-root
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(posimai-sc): 3ステップ後の理解度ジャンプでフォーカス起因のズレを抑止 

Made-with: Cursor
This commit is contained in:
posimai 2026-04-20 20:02:27 +09:00
parent 44c4ffe3c2
commit 220c7c2449
2 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
posimai-sc/index.html
View File

@ -913,7 +913,7 @@ header{display:flex;align-items:center;justify-content:space-between;padding:0 1
</div> </div>
<!-- Quiz --> <!-- Quiz -->
<div id="comprehension-quiz" class="card" x-show="currentUnit?.quiz?.length && (!stepMode || stepStep === 3)"> <div id="comprehension-quiz" class="card" tabindex="-1" x-show="currentUnit?.quiz?.length && (!stepMode || stepStep === 3)">
<div class="quiz-header"> <div class="quiz-header">
<div class="quiz-title-label"> <div class="quiz-title-label">
<i data-lucide="check-circle-2" style="width:13px;height:13px"></i> <i data-lucide="check-circle-2" style="width:13px;height:13px"></i>

7
posimai-sc/js/app.js
View File

@ -824,6 +824,9 @@ document.addEventListener('alpine:init', () => {
this.$nextTick(()=>{ if(window.lucide) lucide.createIcons(); }); this.$nextTick(()=>{ if(window.lucide) lucide.createIcons(); });
}, },
finishStepMode(){ finishStepMode(){
if(document.activeElement && typeof document.activeElement.blur === 'function'){
document.activeElement.blur();
}
this.stepMode=false; this.stepMode=false;
this.$nextTick(()=>{ this.$nextTick(()=>{
if(window.lucide) lucide.createIcons(); if(window.lucide) lucide.createIcons();
@ -833,6 +836,9 @@ document.addEventListener('alpine:init', () => {
}); });
}, },
scrollToComprehension(){ scrollToComprehension(){
if(document.activeElement && typeof document.activeElement.blur === 'function'){
document.activeElement.blur();
}
this.$nextTick(()=>{ this.$nextTick(()=>{
requestAnimationFrame(()=>{ requestAnimationFrame(()=>{
requestAnimationFrame(()=>{ this.scrollMainToComprehension(); }); requestAnimationFrame(()=>{ this.scrollMainToComprehension(); });
@ -844,6 +850,7 @@ document.addEventListener('alpine:init', () => {
const m=document.getElementById('main'); const m=document.getElementById('main');
const el=document.getElementById('comprehension-quiz'); const el=document.getElementById('comprehension-quiz');
if(!m||!el) return; if(!m||!el) return;
try{ el.focus({ preventScroll:true }); }catch(e){}
// main内の実座標で算出して、カード先頭へ安定して合わせる // main内の実座標で算出して、カード先頭へ安定して合わせる
const offset=8; const offset=8;
const top=(el.getBoundingClientRect().top - m.getBoundingClientRect().top) + m.scrollTop - offset; const top=(el.getBoundingClientRect().top - m.getBoundingClientRect().top) + m.scrollTop - offset;