в крайних точках когда x == 0 или x == 300 n равное 5 сделать n = -5 или наоборот n равное минус 5 сделать 5
мне сложно осилить вашу логику, но попробуйте исключить setInterval из ваших кодов навсегда, так будет лучше.

рони,
Спасибо большое! А эту задачу можно решить без setInterval? Ни в коем случае не хочу просить Вас написать код, но хотя бы просто намекните, как решить такую задачу без setInterval.
PS. Ребят, извините за такие нубские вопросы, я в самом начале изучения и вот попалась такая задачка, целый день не мог решить))

И до сих пор у меня остается вопрос, что значит !x

Блин, не увидел по !x. Все, спасибо, теперь понял!

window.setTimeout или window.requestAnimationFrame или $().animate

Спасибо большое!

рони,
Вот напомнили Вы про animate, сразу получилось сделать вот так
https://jsfiddle.net/gooodwin67/kyuLc6oy/
Но все равно, чтобы зациклить пришлось использовать setInterval

очередной бред, безумно расходующй ресурсы браузера и компа, как и ваш пост тут №6.
нет причин чтоб где-то использовать setInterval
https://jsfiddle.net/kyuLc6oy/3/

gooodwin67,
Проще для восприятия - https://jsfiddle.net/kyuLc6oy/4/
Используем коллбэк у функции animate для вызова самовызывающиеся функции foo, тем самым создаем рекурсию.
Теперь тебе осталось написать реализацию с setTimeout

Здесь на самом деле не имеет смысла, что использовать — ведь left не является аппаратно-ускоренным свойством, поэтому не получается ровно 60fps. Также не может принимает дробные значения, из-за чего медленная анимация получается прерывистой.
И вряд ли получится дёргать DOM с частотой 60 раз в секунду, чтобы это было всегда одинаково.

Аппаратно-ускоренным свойства — transform, filter, opacity, mask
Если анимируете не эти свойства, то рискуете получить не идеальную анимацию с 60fps.
В таком случае лучше использовать canvas или video, которые тоже имеют аппаратное ускорение.