diff --git a/js/Weight Calculation Script-Edited-Jquery-V4.js b/js/Weight Calculation Script-Edited-Jquery-V4.js index 383b466..7222b10 100644 --- a/js/Weight Calculation Script-Edited-Jquery-V4.js +++ b/js/Weight Calculation Script-Edited-Jquery-V4.js @@ -43,6 +43,28 @@ // var plateloader = jQuery(".b-platevisual__plates").html(''); // console.log(plateloader); +function animatePlatesOut () { + jQuery('.b-platevisual__plates--left').animate({ + opacity: 0, + left: "-16%", + }, {duration: 500, queue: false }); + jQuery('.b-platevisual__plates--right').animate({ + opacity: 0, + left: "116%", + }, {duration: 500, queue: false }); +} + +function animatePlatesIn () { + jQuery('.b-platevisual__plates--left').animate({ + opacity: 1, + left: "21%", + }, {duration: 500, queue: false }); + jQuery('.b-platevisual__plates--right').animate({ + opacity: 1, + left: "79%", + }, {duration: 500, queue: false }); +} + //plate calulation function function platecalculator ( plateWeights, platesAvailable, target, finalWeight) { @@ -87,9 +109,9 @@ //replaces and animates html for plates required to bar. //if statment works but need to figureout how to step animation. if (jQuery('.b-platevisual__plate').length > 0) { - console.log("Test") + console.log("If Statment Fired") //animates plates off - jQuery('.b-platevisual__plates--left').animate({ + /*jQuery('.b-platevisual__plates--left').animate({ opacity: 0, left: "-16%", }, {duration: 500, queue: false }); @@ -107,19 +129,27 @@ jQuery('.b-platevisual__plates--right').animate({ opacity: 1, left: "79%", - }, {duration: 500, queue: false }); + }, {duration: 500, queue: false });*/ + //animates plates off + animatePlatesOut(); + //updates plates + jQuery(".b-platevisual__plates").html(weighthtml); + //animates plates back on + setTimeout(animatePlatesIn(), 250); } else { //updates plates jQuery(".b-platevisual__plates").html(weighthtml); //animates plates back on - jQuery('.b-platevisual__plates--left').animate({ + /*jQuery('.b-platevisual__plates--left').animate({ opacity: 1, left: "21%", }, {duration: 500, queue: false }); jQuery('.b-platevisual__plates--right').animate({ opacity: 1, left: "79%", - }, {duration: 500, queue: false }); + }, {duration: 500, queue: false });*/ + //animates plates back on + animatePlatesIn(); } }