diff --git a/posimai-sc/js/app.js b/posimai-sc/js/app.js index f94ec3b0..4caedce2 100644 --- a/posimai-sc/js/app.js +++ b/posimai-sc/js/app.js @@ -827,17 +827,28 @@ document.addEventListener('alpine:init', () => { this.stepMode=false; this.$nextTick(()=>{ if(window.lucide) lucide.createIcons(); - const el=document.getElementById('comprehension-quiz'); - if(el) el.scrollIntoView({behavior:'smooth',block:'start'}); + requestAnimationFrame(()=>{ + requestAnimationFrame(()=>{ this.scrollMainToComprehension(); }); + }); }); }, scrollToComprehension(){ this.$nextTick(()=>{ - const el=document.getElementById('comprehension-quiz'); - if(el) el.scrollIntoView({behavior:'smooth',block:'start'}); + requestAnimationFrame(()=>{ + requestAnimationFrame(()=>{ this.scrollMainToComprehension(); }); + }); if(window.lucide) lucide.createIcons(); }); }, + scrollMainToComprehension(){ + const m=document.getElementById('main'); + const el=document.getElementById('comprehension-quiz'); + if(!m||!el) return; + // main内の実座標で算出して、カード先頭へ安定して合わせる + const offset=8; + const top=(el.getBoundingClientRect().top - m.getBoundingClientRect().top) + m.scrollTop - offset; + m.scrollTo({ top:Math.max(0,top), behavior:'smooth' }); + }, stepGoBack(){ if(!this.stepMode) return; if(this.stepStep===1){