スクロールさせる組み込みJSでスマフォだと途中で止まってしまう場合

スクロールさせる組み込みJS（scrollTo）をスマートフォンから実行すると、たまにスクロールが途中で止まってしまう不具合が発見されました。（特にAndroidで発生します）

対象

  • a-blog cms Ver. 2.6.1.2 以下

対応方法

a-blog cmsのバージョンによって、対応方法が少し異なります。バージョンに適切な対応をお願いします。

Ver. 2.5.0以上

テンプレートでacms.jsを読み込んだあと、以下の記述を追加してください。

<script>
	ACMS.Ready(function(){
		ACMS.Library.scrollTo = function ( x, y, m, k, offset, callback )
		{
			y = y + offset;
                        callback = callback || function(){};
        
                        var left = Math.floor(document.body.scrollLeft || document.documentElement.scrollLeft);
                        var top  = Math.floor(document.body.scrollTop  || document.documentElement.scrollTop);
                        var remainX = x - left;
                        var remainY = y - top;
                        var calc = function ()
                        {
                            var h = parseInt(x - remainX);
                            var v = parseInt(y - remainY);
                            remainX = remainX*(1-k);
                            remainY = remainY*(1-k);
                            if(parseInt(remainX) != 0 || parseInt(remainY) != 0){
                                window.scrollTo(h, v);
                                setTimeout(calc,m);
                            }else{
                                window.scrollTo(x,y);
                                callback();
                            }
                        };
                        setTimeout(calc, m);
		};
	});
</script>

Ver. 2.5.0未満

テンプレートでindex.jsを読み込んだあと、以下の記述を追加してください。

<script>
	ACMS.Library.acmsLink({});
	ACMS.Library.scrollTo = function ( x, y, m, k, offset, callback )
	{
		y = y + offset;
                callback = callback || function(){};
    
                var left = Math.floor(document.body.scrollLeft || document.documentElement.scrollLeft);
                var top  = Math.floor(document.body.scrollTop  || document.documentElement.scrollTop);
                var remainX = x - left;
                var remainY = y - top;
                var calc = function ()
                {
                    var h = parseInt(x - remainX);
                    var v = parseInt(y - remainY);
                    remainX = remainX*(1-k);
                    remainY = remainY*(1-k);
                    if(parseInt(remainX) != 0 || parseInt(remainY) != 0){
                        window.scrollTo(h, v);
                        setTimeout(calc,m);
                    }else{
                        window.scrollTo(x,y);
                        callback();
                    }
                };
                setTimeout(calc, m);
	};
</script>

以上の対応を行うことにより、途中でスクロールが止まることはなくなります。

この度はご迷惑をお掛けしてしまい申し訳ございませんでした。
今後ともa-blog cmsをよろしくお願いいたします。