在html5画布内进行边界检测时翻转坐标

Question

this is my jsfiddle : http://jsfiddle.net/whZ44/1/

 std1.x += std1.sp;
 if ((std1.x + std1.w) > cw) {
     std1.x *= -std1.sp; 
 }

when the block hit the right border it should flip it x and start moving to the left and if the block hit the left border it should flip it x and move to the right. I'm having a problem with the code and I would appreciate some help

Answer 1

if ((std1.x + std1.w) > cw || std1.x < 0) {
    // Invert the speed when bat reaches boundaries
    std1.sp *= -1; 
}

Updated fiddle

Answer 2

This works now: http://jsfiddle.net/whZ44/5/

var leftBorderX = 0; // set to the x value of your left border
var newX = std1.x + std1.w;

// if the new x value exceeds the borders (left or right) then invert the speed
if(newX > cw || newX < leftBorderX) std1.sp *= -1;