鍍金池/ 問(wèn)答/HTML5  HTML/ 簡(jiǎn)單的邏輯條件問(wèn)題,關(guān)于左右兩邊觸發(fā)判斷條件的問(wèn)題

簡(jiǎn)單的邏輯條件問(wèn)題,關(guān)于左右兩邊觸發(fā)判斷條件的問(wèn)題

就是一個(gè)單純的邏輯判斷問(wèn)題,小demo兩邊鼠標(biāo)移入判斷有問(wèn)題
因?yàn)閷?shí)在不知道如何設(shè)置第二個(gè)判斷條件,所以才來(lái)此提問(wèn)。下面給出示例代碼,
[示例代碼][https://jsfiddle.net/bpn1h5wk/1/]

**說(shuō)明圖片:**

clipboard.png
clipboard.png
clipboard.png
clipboard.png

目前的問(wèn)題就是,只能從一邊移入,因?yàn)榕袛鄺l件沖突了,具體可以看jsfiddle上的示例代碼.

回答
編輯回答
何蘇葉

看了一下你的代碼,并不需要判斷

這里

if(ex < (line.x)){ //重點(diǎn)就是這個(gè)判斷條件 , 左右兩邊不知道如何設(shè)置 觸發(fā)的判斷條件
    moveX = ex - line.x; // 相對(duì) 原始x 的位置 偏移
}

直接寫(xiě)成 moveX = ex - line.x; 就可以了

test

2017年7月26日 12:50
編輯回答
熟稔

只需要判斷入場(chǎng)和移動(dòng)的方向是否一致即可
改了你的demo
https://jsfiddle.net/bpn1h5wk/3/

2018年8月31日 16:25
編輯回答
入她眼
ct.addEventListener('mousemove',function(e){
           let ex = e.offsetX,
               ey = e.offsetY;
           if(ey > line.y && ey < (line.y + line.long)){  // 只允許在直線的高度內(nèi)執(zhí)行
              let moveY = ey - (line.y  + line.long/2); // y從(long/2) 中心點(diǎn)開(kāi)始偏移計(jì)算
              let moveX = 0;  // x 隨著鼠標(biāo)的移入位置 而改變

              moveX = (ex-line.x)
              
              //其實(shí)更本不用判斷

              line.moveX = moveX;
              line.moveY = moveY;
           }

       })

https://jsfiddle.net/papersna...

2017年1月14日 08:41