javascript - How to make a picture fly in and out on transitions with jquery -
hi have started making web.

i desperately trying make menus fly-in , out on transitions. want menus fly-in in order starting top bottom.
i have updated question original.
html:
<div id="flyin"> <form action="woodenglish.html" method="get"> <input id="wood" type="image" src="wood.png" alt="submit" > </form> </div> javascript:
<script type="text/javascript"> $(document).ready(function () { var currwidth = $(window).width(); console.log(currwidth); var startpos = -1; var endpos = 1000; console.log(endpos); $('#flyin').animate({left: endpos},1000); $('#wood, #submit2').click(function () { if (this.id == 'wood') { $('#flyin').animate({left: endpos}, 1000); } else if (this.id == 'submit1') { alert('submit 2 clicked'); } }); }); </script> however there still 2 problems code
is this; var currwidth = $(window).width(); think. need buttons fly screen out of screen , atm not allowed that.
atm doesn't wait until animation complete before loading next html on action form.
thx in advance contributions
you have referenced items in <head>, before loaded. please wrap in document ready function:
$(document).ready(function () { var currwidth = $(window).width(); console.log(currwidth); var startpos = -100; var endpos = (currwidth / 2) + (startpos / 2); console.log(endpos); $('#flyin').animate({left: endpos}, 1000); });
Comments
Post a Comment