console 命令行工具 X clear

console

$('#part2-Mapself')[0].addEventListener("touchstart", function (event) {
                    document.body.style.overflow = 'hidden';
                    // 获取元素和初始值
                    var oBox = document.getElementById('part2-Mapself'), disX = 0, disY = 0;
                    // 获取浏览器可见区域宽高，div宽高
                    var browserWidth = document.getElementsByClassName('part2-Map')[0].offsetWidth,
                        browserHeight = document.getElementsByClassName('part2-Map')[0].offsetHeight,
                        boxWidth = document.getElementById('part2-Mapself').offsetWidth,
                        boxHeight = document.getElementById('part2-Mapself').offsetHeight,
                        boxleft = document.getElementById('part2-Mapself').offsetLeft,
                        boxtop = document.getElementById('part2-Mapself').offsetTop;
                    var e = event.changedTouches[0];
                    // 鼠标相对于div左侧位置
                    disX = e.clientX - boxleft;
                    disY = e.clientY - boxtop;
                    $('#part2-Mapself')[0].addEventListener('touchmove', function (event) {
                        var e = event.changedTouches[0];

                        oBox.style.left = (e.clientX - disX) + 'px';
                        if ((e.clientX - disX) > 0) {
                            oBox.style.left = 0;
                        } else if ((boxWidth - disX + e.clientX) <= browserWidth) {
                            oBox.style.left = browserWidth - boxWidth + "px";
                        }
                        oBox.style.top = (e.clientY - disY) + 'px';
                        if ((e.clientY - disY) > 0) {
                            oBox.style.top = 0;
                        } else if ((boxHeight - disY + e.clientY) <= browserHeight) {
                            oBox.style.top = browserHeight - boxHeight + "px";
                        }
                    })
                    $('#part2-Mapself')[0].addEventListener('touchend', function (event) {
                        document.body.style.overflow = 'scroll';
                        // var x = event.changedTouches[0].pageX;
                        // var y = event.changedTouches[0].pageY;
                        // console.log("touchend  x: " + x + "y: " + y);
                    })
                });

<html>

<body>
	<div class="part2-Map">
		<div id="part2-Mapself"></div>
	</div>
</body>

</html>

.part2-Map{
    width: 16.9rem;
    height: 14.91rem;
    border-radius: 11px;
    border: 3px solid #000;
    position: absolute;
    top: 1rem;
    overflow: hidden;
}
#part2-Mapself{
    width: 35.25rem;
    height: 31.23rem;
    background-image:url("//img10.360buyimg.com/imgzone/jfs/t1/151263/6/18347/600989/601a1cd9Efa2ca149/fa5d0863c44f7549.png");
    background-size:100% 100%;
    position: absolute;
}

本项目引用的自定义外部资源

jquery.min.js