javascript - Move an element left on each click -


i think main question "how write this?" simple thing. every click css left property gets 500px taken off. (moved 500px left)

i having hard time variables , ... don't know.

$(document).ready(function() {       var belt-move = 500;     var belt-ammount = $(".belt").css('left');     belt-move -=  belt-ammount;        $(".next").click(function() {         $(".belt").animate(belt-move, 500, "swing");      }); });  

first of javascript (ecmascript) doesn't allow minus character '-' in variables names, can't use name belt-move, instead should use underscore '_' (belt_move) or camel case convention (beltmove).

second: defining jquery animation need define property want change, in case 'left'.the 'swing' easing function default don't need pass it.

third: $(function() {...}); shorter version of $(document).ready(function() {...});

so final code should this:

$(function() {     var beltmove = 500;     var moveduration = 500;     $(".next").click(function() {         var jqbelt = $(".belt");         jqbelt.animate({left:"-="+beltmove}, moveduration);     }); }); 

Comments

Popular posts from this blog

python - Scipy curvefit RuntimeError:Optimal parameters not found: Number of calls to function has reached maxfev = 1000 -

c# - How to add a new treeview at the selected node? -

java - netbeans "Please wait - classpath scanning in progress..." -