/*近期專案需要蘋果電腦，如果您支援學生創業並願意贊助我們一臺，請聯絡我QQ696619，您可以提前獲取16頁創意文件，或者我們可以幫助開發一些小專案*/

原本要做一種效果：上下左右滑動頁面，可以切換到圖片（表格佈局）。

效果實現了，但還沒應用上。

//--------圖片滑動導航---------
            var startX; //觸控起始橫座標
            var startY; //觸控起始縱座標
            var moveSpave; //移動的距離
            var isMoveX = true; //判斷是否為左右移動
            var isFirst = true;   //是否要判斷touchmove方向
            $("#imgSelect").on("touchstart touchmove touchend touchcancel", function (e) {
                e.preventDefault(); //該區域禁止滑動切換頁面
                if (e.originalEvent.type == "touchstart") {
                    startX = e.originalEvent.touches[0].pageX; //觸控起始位置賦值
                    startY = e.originalEvent.touches[0].pageY; //觸控起始位置賦值
                    isFirst = true;
                }
                else if (e.originalEvent.type == "touchmove") {
                    var moveX = e.originalEvent.touches[0].pageX
                    var moveY = e.originalEvent.touches[0].pageY;
                    if (isFirst) {
                        Math.abs(moveX - startX) - Math.abs(moveY - startY) >= 2 ? isMoveX = true : isMoveX = false;
                        isFirst = false;
                        return;
                    }

                    if (isMoveX) {
                        //水平滑動
                        moveSpave = moveX - startX;
                    }
                    else {
                        //豎直滑動
                        moveSpave = moveY - startY;
                    }

                }
                else if (e.originalEvent.type == "touchend") {
                    if (isMoveX) {
                        if (moveSpave < 0 && j <= 2) {
                            //向左滑動
                            Add("#topLight", j+1); //開關對應燈
                            j = j + 1;
                        }
                        else if (moveSpave > 0 && j >= 1) {
                            //向右滑動
                            Sub("#topLight", j+1);
                            j = j - 1;
                        }
                    }
                    else {
                        if (moveSpave < 0 && i <= 2) {
                            //向上滑動
                            Add("#rightLight", i + 1); //開關對應燈
                            i = i + 1;
                        }
                        else if (moveSpave > 0 && i >= 1) {
                            //向下滑動
                            Sub("#rightLight", i + 1); //開關對應燈
                            i = i - 1;
                        }
                    }
                    $("#imgClick").attr("src", arrImg[i][j]);
                }
 

//------
            function Add(id, x) {
                var idd = id + x;
                $(idd).attr("src", "img/Select_Off.png");
                x = x + 1;
                idd = id + x;
                $(idd).attr("src", "img/Select_On.png");
            }
            function Sub(id, x) {
                var idd = id + x;
                $(idd).attr("src", "img/Select_Off.png");
                x = x - 1;
                idd = id + x;
                $(idd).attr("src", "img/Select_On.png");
            }
 

<span id="topLight"><!--橫向指示燈-->
            <img id="topLight1" src="img/Select_On.png" />
            <img id="topLight2" src="img/Select_Off.png" />
            <img id="topLight3" src="img/Select_Off.png" />
            <img id="topLight4" src="img/Select_Off.png" />
        </span>
        <div id="rightLight"><!--豎向指示燈-->
            <img id="rightLight1" class="rightImg" src="img/Select_Off.png" />
            <img id="rightLight2" class="rightImg" src="img/Select_On.png" />
            <img id="rightLight3" class="rightImg" src="img/Select_Off.png" />
            <img id="rightLight4" class="rightImg" src="img/Select_Off.png" />
        </div>