本文整理汇总了TypeScript中velocity-animate.default函数的典型用法代码示例。如果您正苦于以下问题：TypeScript default函数的具体用法？TypeScript default怎么用？TypeScript default使用的例子？那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。
在下文中一共展示了default函数的15个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: Velocity
QUnit.test("End Value Caching", (assert) => {
const done = assert.async(2),
newProperties = {height: "50px", width: "250px"};
assert.expect(4);
/* Called after the last call is complete (stale). Ensure that the newly-set (via $.css()) properties are used. */
Velocity(getTarget(newProperties), defaultProperties)
.then((elements) => {
assert.equal(Data(elements[0]).cache.width, defaultProperties.width, "Stale end value #1 wasn't pulled.");
assert.equal(Data(elements[0]).cache.height, defaultProperties.height, "Stale end value #2 wasn't pulled.");
done();
});
Velocity(getTarget(), defaultProperties)
.velocity(newProperties)
.then((elements) => {
/* Chained onto a previous call (fresh). */
assert.equal(Data(elements[0]).cache.width, newProperties.width, "Chained end value #1 was pulled.");
assert.equal(Data(elements[0]).cache.height, newProperties.height, "Chained end value #2 was pulled.");
done();
});
});示例2: asyncTests
asyncTests(assert, 1, (done) => {
const $target = getTarget();
Velocity($target, defaultProperties, defaultOptions);
Velocity($target, {top: 0}, defaultOptions);
Velocity($target, {width: 0}, defaultOptions);
Velocity($target, "stop");
assert.ok(true, "Calling on an element that is animating doesn't cause an error.");
done();
});示例3: asyncTests
asyncTests(assert, 1, (done) => {
let success = false;
try {
success = true;
Velocity(getTarget(), defaultProperties, {easing: ["a" as any, 0.5, 0.5, 0.5]});
Velocity(getTarget(), defaultProperties, {easing: [0.5, 0.5, 0.5]});
} catch (e) {
success = false;
}
assert.ok(success, "Invalid bezier curve didn't throw error.");
done();
});示例4: asyncTests
asyncTests(assert, 4, (done) => {
const testOptions = {loop: 2, delay: 100, duration: 100},
start = getNow();
let begin = 0,
complete = 0,
loop = 0,
lastPercentComplete = 2;
Velocity(getTarget(), defaultProperties,
{
loop: testOptions.loop,
delay: testOptions.delay,
duration: testOptions.duration,
begin() {
begin++;
},
progress(elements, percentComplete) {
if (lastPercentComplete > percentComplete) {
loop++;
}
lastPercentComplete = percentComplete;
},
complete() {
complete++;
},
})
.then(() => {
assert.equal(begin, 1, "Begin callback only called once.");
assert.equal(loop, testOptions.loop * 2 - 1, "Animation looped correct number of times (once each direction per loop).");
assert.close(getNow() - start, (testOptions.delay + testOptions.duration) * loop, 32, "Looping with 'delay' has correct duration.");
assert.equal(complete, 1, "Complete callback only called once.");
done();
});
});示例5: asyncTests
asyncTests(assert, 4, (done) => {
const testOptions = {repeat: 2, delay: 100, duration: 100},
start = Date.now();
let begin = 0,
complete = 0,
repeat = 0;
Velocity(getTarget(), defaultProperties, {
repeat: testOptions.repeat,
delay: testOptions.delay,
duration: testOptions.duration,
begin() {
begin++;
},
progress(elements, percentComplete) {
if (percentComplete === 1) {
repeat++;
}
},
complete() {
complete++;
assert.equal(begin, 1, "Begin callback only called once.");
assert.equal(repeat, testOptions.repeat + 1, "Animation repeated correct number of times (original plus repeats).");
assert.close(Date.now() - start, (testOptions.delay + testOptions.duration) * (testOptions.repeat + 1), (testOptions.repeat + 1) * 16 + 32,
"Repeat with 'delay' has correct duration.");
assert.equal(complete, 1, "Complete callback only called once.");
done();
},
});
});示例6: asyncTests
asyncTests(assert, 2, (done) => {
Velocity($target, "reverse", {
complete(elements) {
assert.equal(elements[0].velocity("style", "opacity"), defaultProperties.opacity, `Chained reversed property #1 set correctly. (${defaultProperties.opacity})`);
assert.equal(elements[0].velocity("style", "width"), defaultProperties.width, `Chained reversed property #2 set correctly. (${defaultProperties.width})`);
done();
},
});
});示例7: asyncTests
asyncTests(assert, 1, async (done) => {
const $target = getTarget(),
$targetSet = [getTarget(), $target, getTarget()];
let complete = false;
Velocity($target, defaultProperties, {
duration: 300,
complete() {
complete = true;
},
});
Velocity($targetSet, defaultProperties, {
sync: false,
duration: 250,
});
await sleep(275);
assert.notOk(complete, "Sync 'false' animations don't wait for completion.");
done();
});示例8: asyncTests
asyncTests(assert, 1, (done) => {
const $targetSet = [getTarget(), getTarget()];
Velocity($targetSet, defaultProperties, {
duration: asyncCheckDuration,
complete(elements) {
assert.deepEqual(elements, $targetSet, "Elements passed into callback.");
done();
},
});
});示例9: once
QUnit.test("Visibility", (assert) => {
const done = assert.async(4);
Velocity(getTarget(), "style", "visibility", "hidden")
.velocity({visibility: "visible"}, {
progress: once((elements: VelocityResult) => {
assert.equal(elements.velocity("style", "visibility"), "visible", "Visibility:'visible' was set immediately.");
done();
}),
});
Velocity(getTarget(), "style", "visibility", "hidden")
.velocity("style", "visibility", "")
.then((elements) => {
// NOTE: The test elements inherit "hidden", so while illogical it
// is in fact correct.
assert.equal(elements.velocity("style", "visibility"), "hidden", "Visibility:'' was reset correctly.");
done();
});
Velocity(getTarget(), {visibility: "hidden"}, {
progress: once((elements: VelocityResult) => {
assert.notEqual(elements.velocity("style", "visibility"), "visible", "Visibility:'hidden' was not set immediately.");
done();
}),
})
.then((elements) => {
assert.equal(elements.velocity("style", "visibility"), "hidden", "Visibility:'hidden' was set upon completion.");
done();
});
});示例10: getTarget
asyncTests(assert, 2, (done) => {
const $target = getTarget();
Velocity($target, "pause");
assert.ok(true, "Calling \"pause\" on an element that isn't animating doesn't cause an error.");
Velocity($target, "resume");
assert.ok(true, "Calling \"resume\" on an element that isn't animating doesn't cause an error.");
done();
});示例11: sleep
asyncTests(assert, 1, async (done) => {
const $target = getTarget();
Velocity($target, {opacity: 0}, {queue: "test", duration: 250});
Velocity("pause", "test");
await sleep(300);
assert.equal(getPropertyValue($target, "opacity"), "1", "Pause 'queue' works globally.");
done();
});示例12: sleep
asyncTests(assert, 1, async (done) => {
const $target = getTarget();
Velocity($target, {left: "500px"}, {duration: 10});
await sleep(100);
Velocity($target, {left: 0}, {duration: 10});
await sleep(1000);
assert.equal(getPropertyValue($target, "left"), "0px", "Finished animated value given as number 0 should be the same as 0px.");
done();
});示例13: open
open() {
if (!this.active) {
this.active = true;
var reveal: HTMLElement = this.$els.reveal;
if (reveal) {
reveal.style.display = 'block';
Velocity(reveal, "stop", false);
Velocity(reveal, {translateY: '-100%'}, {duration: 300, queue: false, easing: 'easeInOutQuad'});
}
}
}示例14: setTimeout
setTimeout(function() {
if (started != true) {
Velocity(tooltip, {opacity: 0, marginTop: 0, marginLeft: 0}, { duration: 225, queue: false});
Velocity(backdrop, {opacity: 0, scale: 1}, {
duration: 225,
queue: false,
complete: function() {
backdrop.style.display = 'none';
tooltip.style.display = 'none';
started = false;
}
});
}
}, 225);示例15: open
open() {
if (!this.active) {
this.active = true;
var offsetY, offsetX;
if (this.horizontal) {
offsetX = 40;
} else {
offsetY = 40;
}
var items = Array.prototype.slice.call(this.$el.querySelectorAll('ul .btn-floating'));
Velocity(items,
{scaleY: ".4", scaleX: ".4", translateY: offsetY + 'px', translateX: offsetX + 'px'},
{duration: 0});
var time = 0;
items.reverse().forEach(function (item) {
Velocity(item,
{opacity: "1", scaleX: "1", scaleY: "1", translateY: "0", translateX: '0'},
{duration: 80, delay: time});
time += 40;
});
}
}