fix(posimai-sc): 3ステップ後の理解度ジャンプでフォーカス起因のズレを抑止
Made-with: Cursor
This commit is contained in:
parent
44c4ffe3c2
commit
220c7c2449
|
|
@ -913,7 +913,7 @@ header{display:flex;align-items:center;justify-content:space-between;padding:0 1
|
|||
</div>
|
||||
|
||||
<!-- 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-title-label">
|
||||
<i data-lucide="check-circle-2" style="width:13px;height:13px"></i>
|
||||
|
|
|
|||
|
|
@ -824,6 +824,9 @@ document.addEventListener('alpine:init', () => {
|
|||
this.$nextTick(()=>{ if(window.lucide) lucide.createIcons(); });
|
||||
},
|
||||
finishStepMode(){
|
||||
if(document.activeElement && typeof document.activeElement.blur === 'function'){
|
||||
document.activeElement.blur();
|
||||
}
|
||||
this.stepMode=false;
|
||||
this.$nextTick(()=>{
|
||||
if(window.lucide) lucide.createIcons();
|
||||
|
|
@ -833,6 +836,9 @@ document.addEventListener('alpine:init', () => {
|
|||
});
|
||||
},
|
||||
scrollToComprehension(){
|
||||
if(document.activeElement && typeof document.activeElement.blur === 'function'){
|
||||
document.activeElement.blur();
|
||||
}
|
||||
this.$nextTick(()=>{
|
||||
requestAnimationFrame(()=>{
|
||||
requestAnimationFrame(()=>{ this.scrollMainToComprehension(); });
|
||||
|
|
@ -844,6 +850,7 @@ document.addEventListener('alpine:init', () => {
|
|||
const m=document.getElementById('main');
|
||||
const el=document.getElementById('comprehension-quiz');
|
||||
if(!m||!el) return;
|
||||
try{ el.focus({ preventScroll:true }); }catch(e){}
|
||||
// main内の実座標で算出して、カード先頭へ安定して合わせる
|
||||
const offset=8;
|
||||
const top=(el.getBoundingClientRect().top - m.getBoundingClientRect().top) + m.scrollTop - offset;
|
||||
|
|
|
|||
Loading…
Reference in New Issue