Updated Yellow Plate and adjusted animation speeds
Added border to yellow plate to make it easer to see. Adjusted animations to be more fluid.
This commit is contained in:
@@ -3,11 +3,16 @@
|
||||
<!-- Generator: Sketch 43.1 (39012) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>35lbs-Plate</title>
|
||||
<desc>Created with Sketch.</desc>
|
||||
<defs></defs>
|
||||
<defs>
|
||||
<rect id="path-1" x="0" y="0" width="8" height="64" rx="4"></rect>
|
||||
</defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="35lbs-Plate" fill-rule="nonzero">
|
||||
<g id="Group" transform="translate(4.000000, 32.000000) scale(-1, 1) translate(-4.000000, -32.000000) ">
|
||||
<rect id="Rectangle-path" fill="#FFFF00" x="0" y="0" width="8" height="64" rx="4"></rect>
|
||||
<g id="Rectangle-path">
|
||||
<use fill="#FFFF00" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<rect stroke="#979797" stroke-width="1" x="0.5" y="0.5" width="7" height="63" rx="3.5"></rect>
|
||||
</g>
|
||||
<g transform="translate(4.000000, 32.000000) scale(-1, 1) translate(-4.000000, -32.000000) translate(1.000000, 22.000000)" fill="#48484A">
|
||||
<path d="M2.79003925,8.19042969 C1.9632122,8.19042969 1.36344606,7.96338118 0.990722844,7.50927734 C0.617999626,7.05517351 0.431640812,6.50260742 0.431640812,5.8515625 L1.34960956,5.8515625 C1.38867226,6.30403872 1.47330683,6.63281147 1.60351581,6.83789062 C1.83138154,7.20573101 2.24316127,7.38964844 2.83886737,7.38964844 C3.30110927,7.38964844 3.67219931,7.26595176 3.95214862,7.01855469 C4.23209794,6.77115762 4.3720705,6.45215039 4.3720705,6.06152344 C4.3720705,5.5797502 4.2247738,5.2428395 3.93017597,5.05078125 C3.63557814,4.858723 3.22623979,4.76269531 2.70214862,4.76269531 C2.64355458,4.76269531 2.58414762,4.76350911 2.52392597,4.76513672 C2.46370431,4.76676433 2.40266977,4.76920571 2.3408205,4.77246094 L2.3408205,3.99609375 C2.43196679,4.00585942 2.50846342,4.01236978 2.57031269,4.015625 C2.63216196,4.01888022 2.69889306,4.02050781 2.770508,4.02050781 C3.09928569,4.02050781 3.36946528,3.968425 3.58105487,3.86425781 C3.95215048,3.68196523 4.1376955,3.35644766 4.1376955,2.88769531 C4.1376955,2.53938628 4.01399882,2.27083428 3.76660175,2.08203125 C3.51920468,1.89322822 3.23112162,1.79882812 2.90234394,1.79882812 C2.31640351,1.79882812 1.91113412,1.99413867 1.68652362,2.38476562 C1.56282509,2.59961045 1.49283881,2.90559697 1.47656269,3.30273438 L0.607422062,3.30273438 C0.607422062,2.78189844 0.711587687,2.33919453 0.919922062,1.97460938 C1.27799677,1.32356445 1.90787328,0.998046875 2.8095705,0.998046875 C3.52246469,0.998046875 4.07421698,1.15673669 4.46484394,1.47412109 C4.85547089,1.79150549 5.05078144,2.25129907 5.05078144,2.85351562 C5.05078144,3.28320527 4.9352227,3.63150908 4.70410175,3.8984375 C4.56087187,4.06445396 4.37532685,4.19466099 4.14746112,4.2890625 C4.51530151,4.38997446 4.80257077,4.58447122 5.00927753,4.87255859 C5.21598429,5.16064597 5.31933612,5.51301875 5.31933612,5.9296875 C5.31933612,6.59700854 5.09961176,7.1406229 4.66015644,7.56054688 C4.22070112,7.98047085 3.59733495,8.19042969 2.79003925,8.19042969 Z" id="3"></path>
|
||||
<path d="M1.42773456,17.2177734 C1.48632861,17.719078 1.71907367,18.0657542 2.12597675,18.2578125 C2.33431112,18.3554692 2.57519413,18.4042969 2.848633,18.4042969 C3.36946894,18.4042969 3.75520727,18.2382829 4.00585956,17.90625 C4.25651186,17.5742171 4.38183612,17.2063822 4.38183612,16.8027344 C4.38183612,16.3144507 4.23291183,15.9368503 3.93505878,15.6699219 C3.63720573,15.4029935 3.27995019,15.2695312 2.86328144,15.2695312 C2.56054555,15.2695312 2.30094528,15.3281244 2.08447284,15.4453125 C1.86800041,15.5625006 1.68326918,15.7252594 1.53027362,15.9335938 L0.768554875,15.8896484 L1.30078144,12.125 L4.93359394,12.125 L4.93359394,12.9746094 L1.95996112,12.9746094 L1.66210956,14.9179688 C1.82487079,14.7942702 1.97949164,14.7014977 2.12597675,14.6396484 C2.38639472,14.532226 2.68749848,14.4785156 3.02929706,14.4785156 C3.67057631,14.4785156 4.21419067,14.6852193 4.66015644,15.0986328 C5.10612221,15.5120463 5.32910175,16.0361296 5.32910175,16.6708984 C5.32910175,17.331709 5.12483947,17.9143855 4.71630878,18.4189453 C4.30777809,18.9235051 3.65592914,19.1757812 2.76074237,19.1757812 C2.19107807,19.1757812 1.68733962,19.0154638 1.24951191,18.6948242 C0.811684196,18.3741846 0.566732219,17.8818393 0.514648625,17.2177734 L1.42773456,17.2177734 Z" id="5"></path>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.4 KiB |
@@ -47,22 +47,22 @@
|
||||
jQuery('.b-platevisual__plates--left').animate({
|
||||
opacity: 0,
|
||||
left: "-16%",
|
||||
}, {duration: 500, queue: false });
|
||||
}, {duration: 350, queue: false });
|
||||
jQuery('.b-platevisual__plates--right').animate({
|
||||
opacity: 0,
|
||||
left: "116%",
|
||||
}, {duration: 500, queue: false });
|
||||
}, {duration: 350, queue: false });
|
||||
}
|
||||
|
||||
function animatePlatesIn() {
|
||||
jQuery('.b-platevisual__plates--left').animate({
|
||||
opacity: 1,
|
||||
left: "21%",
|
||||
}, {duration: 500, queue: false });
|
||||
}, {duration: 350, queue: false });
|
||||
jQuery('.b-platevisual__plates--right').animate({
|
||||
opacity: 1,
|
||||
left: "79%",
|
||||
}, {duration: 500, queue: false });
|
||||
}, {duration: 350, queue: false });
|
||||
}
|
||||
|
||||
|
||||
@@ -111,14 +111,12 @@
|
||||
if (jQuery('.b-platevisual__plate').length > 0) {
|
||||
//animates plates off
|
||||
animatePlatesOut();
|
||||
//updates plates
|
||||
// jQuery(".b-platevisual__plates").html(weighthtml);
|
||||
//updates plates - v2
|
||||
setTimeout(function(){
|
||||
jQuery(".b-platevisual__plates").html(weighthtml);
|
||||
}, 500);
|
||||
//animates plates back on
|
||||
setTimeout(animatePlatesIn, 500);
|
||||
setTimeout(animatePlatesIn, 350);
|
||||
} else {
|
||||
//updates plates
|
||||
jQuery(".b-platevisual__plates").html(weighthtml);
|
||||
@@ -145,7 +143,7 @@
|
||||
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
|
||||
$('html, body').animate({
|
||||
scrollTop: $(hash).offset().top
|
||||
}, 800, function(){
|
||||
}, 500, function(){
|
||||
|
||||
// Add hash (#) to URL when done scrolling (default click behavior)
|
||||
window.location.hash = hash;
|
||||
@@ -156,7 +154,6 @@
|
||||
//show reset button on calculate
|
||||
jQuery(".input-calculate").click(function(){
|
||||
jQuery(".b-infoentry__reset, .b-platevisual__weightfinal, .b-platevisual__weightdifference").show();
|
||||
|
||||
});
|
||||
|
||||
//hide reset button on weight input
|
||||
@@ -168,14 +165,7 @@
|
||||
jQuery(".b-infoentry__reset").click(function(){
|
||||
jQuery(".input-weight, .input-weightsneeded").val('');
|
||||
jQuery(".input-final, .input-difference").html('0');
|
||||
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 });
|
||||
animatePlatesOut();
|
||||
jQuery(".b-infoentry__reset, .b-platevisual__weightfinal, .b-platevisual__weightdifference").hide();
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user