Version Description
Download this release
Release Info
Developer | eleopard |
Plugin | Animate It! |
Version | 2.3.0 |
Comparing to | |
See all releases |
Code changes from version 2.2.1 to 2.3.0
- assets/css/animate-animo.css +796 -1
- assets/css/blank.css +2 -0
- assets/helper/edsanimate-tinymce-popup.php +828 -748
- assets/js/edsanimate.js +105 -105
- edsanimate.php +35 -18
- legal.txt +2 -1
- readme.txt +6 -2
assets/css/animate-animo.css
CHANGED
@@ -4475,4 +4475,799 @@ Daniel Raftery <@ThirvingKings>
|
|
4475 |
-webkit-animation-play-state: paused;
|
4476 |
animation-play-state: paused;
|
4477 |
}
|
4478 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
4475 |
-webkit-animation-play-state: paused;
|
4476 |
animation-play-state: paused;
|
4477 |
}
|
4478 |
+
|
4479 |
+
/* originally authored by Ian Lunn - https://github.com/IanLunn */
|
4480 |
+
|
4481 |
+
/* Grow */
|
4482 |
+
@-webkit-keyframes grow {
|
4483 |
+
100% { -webkit-transform: scale(1.1); }
|
4484 |
+
}
|
4485 |
+
|
4486 |
+
@-moz-keyframes grow {
|
4487 |
+
100% { -moz-transform: scale(1.1); }
|
4488 |
+
}
|
4489 |
+
|
4490 |
+
@-o-keyframes grow {
|
4491 |
+
100% { -o-transform: scale(1.1); }
|
4492 |
+
}
|
4493 |
+
|
4494 |
+
@keyframes grow {
|
4495 |
+
100% { transform: scale(1.1); }
|
4496 |
+
}
|
4497 |
+
|
4498 |
+
.animated.grow {
|
4499 |
+
-webkit-animation-name: grow;
|
4500 |
+
-moz-animation-name: grow;
|
4501 |
+
-o-animation-name: grow;
|
4502 |
+
animation-name: grow;
|
4503 |
+
}
|
4504 |
+
|
4505 |
+
/* Shrink */
|
4506 |
+
@-webkit-keyframes shrink {
|
4507 |
+
100% { -webkit-transform: scale(0.9); }
|
4508 |
+
}
|
4509 |
+
|
4510 |
+
@-moz-keyframes shrink {
|
4511 |
+
100% { -moz-transform: scale(0.9); }
|
4512 |
+
}
|
4513 |
+
|
4514 |
+
@-o-keyframes shrink {
|
4515 |
+
100% { -o-transform: scale(0.9); }
|
4516 |
+
}
|
4517 |
+
|
4518 |
+
@keyframes shrink {
|
4519 |
+
100% { transform: scale(0.9); }
|
4520 |
+
}
|
4521 |
+
|
4522 |
+
.animated.shrink {
|
4523 |
+
-webkit-animation-name: shrink;
|
4524 |
+
-moz-animation-name: shrink;
|
4525 |
+
-o-animation-name: shrink;
|
4526 |
+
animation-name: shrink;
|
4527 |
+
}
|
4528 |
+
|
4529 |
+
/* Pulse Grow */
|
4530 |
+
@-webkit-keyframes pulseGrow {
|
4531 |
+
0% { -webkit-transform: scale(1.1); }
|
4532 |
+
}
|
4533 |
+
|
4534 |
+
@-moz-keyframes pulseGrow {
|
4535 |
+
0% { -moz-transform: scale(1.1); }
|
4536 |
+
}
|
4537 |
+
|
4538 |
+
@-o-keyframes pulseGrow {
|
4539 |
+
0% { -o-transform: scale(1.1); }
|
4540 |
+
}
|
4541 |
+
|
4542 |
+
@keyframes pulseGrow {
|
4543 |
+
0% { transform: scale(1.1); }
|
4544 |
+
}
|
4545 |
+
|
4546 |
+
.animated.pulseGrow {
|
4547 |
+
-webkit-animation-iteration-count: infinite;
|
4548 |
+
-moz-animation-iteration-count: infinite;
|
4549 |
+
-o-animation-iteration-count: infinite;
|
4550 |
+
animation-iteration-count: infinite;
|
4551 |
+
-webkit-animation-direction: alternate;
|
4552 |
+
-moz-animation-direction: alternate;
|
4553 |
+
-o-animation-direction: alternate;
|
4554 |
+
animation-direction: alternate;
|
4555 |
+
-webkit-animation-name: pulseGrow;
|
4556 |
+
-moz-animation-name: pulseGrow;
|
4557 |
+
-o-animation-name: pulseGrow;
|
4558 |
+
animation-name: pulseGrow;
|
4559 |
+
}
|
4560 |
+
|
4561 |
+
/* Pulse Shrink */
|
4562 |
+
@-webkit-keyframes pulseShrink {
|
4563 |
+
0% { -webkit-transform: scale(0.9); }
|
4564 |
+
}
|
4565 |
+
|
4566 |
+
@-moz-keyframes pulseShrink {
|
4567 |
+
0% { -moz-transform: scale(0.9); }
|
4568 |
+
}
|
4569 |
+
|
4570 |
+
@-o-keyframes pulseShrink {
|
4571 |
+
0% { -o-transform: scale(0.9); }
|
4572 |
+
}
|
4573 |
+
|
4574 |
+
@keyframes pulseShrink {
|
4575 |
+
0% { transform: scale(0.9); }
|
4576 |
+
}
|
4577 |
+
|
4578 |
+
.animated.pulseShrink {
|
4579 |
+
-webkit-animation-iteration-count: infinite;
|
4580 |
+
-moz-animation-iteration-count: infinite;
|
4581 |
+
-o-animation-iteration-count: infinite;
|
4582 |
+
animation-iteration-count: infinite;
|
4583 |
+
-webkit-animation-direction: alternate;
|
4584 |
+
-moz-animation-direction: alternate;
|
4585 |
+
-o-animation-direction: alternate;
|
4586 |
+
animation-direction: alternate;
|
4587 |
+
-webkit-animation-name: pulseShrink;
|
4588 |
+
-moz-animation-name: pulseShrink;
|
4589 |
+
-o-animation-name: pulseShrink;
|
4590 |
+
animation-name: pulseShrink;
|
4591 |
+
}
|
4592 |
+
|
4593 |
+
/* Push */
|
4594 |
+
@-webkit-keyframes push {
|
4595 |
+
50% { -webkit-transform: scale(0.8); }
|
4596 |
+
100% { -webkit-transform: scale(1); }
|
4597 |
+
}
|
4598 |
+
|
4599 |
+
@-moz-keyframes push {
|
4600 |
+
50% { -moz-transform: scale(0.8); }
|
4601 |
+
100% { -moz-transform: scale(1); }
|
4602 |
+
}
|
4603 |
+
|
4604 |
+
@-o-keyframes push {
|
4605 |
+
50% { -o-transform: scale(0.8); }
|
4606 |
+
100% { -o-transform: scale(1); }
|
4607 |
+
}
|
4608 |
+
|
4609 |
+
@keyframes push {
|
4610 |
+
50% { transform: scale(0.8); }
|
4611 |
+
100% { transform: scale(1); }
|
4612 |
+
}
|
4613 |
+
|
4614 |
+
.animated.push {
|
4615 |
+
-webkit-animation-name: push;
|
4616 |
+
-moz-animation-name: push;
|
4617 |
+
-o-animation-name: push;
|
4618 |
+
animation-name: push;
|
4619 |
+
}
|
4620 |
+
|
4621 |
+
/* Pop */
|
4622 |
+
@-webkit-keyframes pop {
|
4623 |
+
50% { -webkit-transform: scale(1.2); }
|
4624 |
+
}
|
4625 |
+
|
4626 |
+
@-moz-keyframes pop {
|
4627 |
+
50% { -moz-transform: scale(1.2); }
|
4628 |
+
}
|
4629 |
+
|
4630 |
+
@-o-keyframes pop {
|
4631 |
+
50% { -o-transform: scale(1.2); }
|
4632 |
+
}
|
4633 |
+
|
4634 |
+
@keyframes pop {
|
4635 |
+
50% { transform: scale(1.2); }
|
4636 |
+
}
|
4637 |
+
|
4638 |
+
.animated.pop {
|
4639 |
+
-webkit-animation-name: pop;
|
4640 |
+
-moz-animation-name: pop;
|
4641 |
+
-o-animation-name: pop;
|
4642 |
+
animation-name: pop;
|
4643 |
+
}
|
4644 |
+
|
4645 |
+
/* Rotate */
|
4646 |
+
@-webkit-keyframes rotate {
|
4647 |
+
100% { -webkit-transform: rotate(60deg); }
|
4648 |
+
}
|
4649 |
+
|
4650 |
+
@-moz-keyframes rotate {
|
4651 |
+
100% { -moz-transform: rotate(60deg); }
|
4652 |
+
}
|
4653 |
+
|
4654 |
+
@-o-keyframes rotate {
|
4655 |
+
100% { -o-transform: rotate(60deg); }
|
4656 |
+
}
|
4657 |
+
|
4658 |
+
@keyframes rotate {
|
4659 |
+
100% { transform: rotate(60deg); }
|
4660 |
+
}
|
4661 |
+
|
4662 |
+
.animated.rotate {
|
4663 |
+
-webkit-animation-name: rotate;
|
4664 |
+
-moz-animation-name: rotate;
|
4665 |
+
-o-animation-name: rotate;
|
4666 |
+
animation-name: rotate;
|
4667 |
+
}
|
4668 |
+
|
4669 |
+
/* Grow Rotate */
|
4670 |
+
@-webkit-keyframes growRotate {
|
4671 |
+
100% { -webkit-transform: scale(1.1) rotate(60deg); }
|
4672 |
+
}
|
4673 |
+
|
4674 |
+
@-moz-keyframes growRotate {
|
4675 |
+
100% { -moz-transform: scale(1.1) rotate(60deg); }
|
4676 |
+
}
|
4677 |
+
|
4678 |
+
@-o-keyframes growRotate {
|
4679 |
+
100% { -o-transform: scale(1.1) rotate(60deg); }
|
4680 |
+
}
|
4681 |
+
|
4682 |
+
@keyframes growRotate {
|
4683 |
+
100% { transform: scale(1.1) rotate(60deg); }
|
4684 |
+
}
|
4685 |
+
|
4686 |
+
.animated.growRotate {
|
4687 |
+
-webkit-animation-name: growRotate;
|
4688 |
+
-moz-animation-name: growRotate;
|
4689 |
+
-o-animation-name: growRotate;
|
4690 |
+
animation-name: growRotate;
|
4691 |
+
}
|
4692 |
+
|
4693 |
+
/* Float */
|
4694 |
+
@-webkit-keyframes float {
|
4695 |
+
100% { -webkit-transform: translateY(-8px); }
|
4696 |
+
}
|
4697 |
+
|
4698 |
+
@-moz-keyframes float {
|
4699 |
+
100% { -moz-transform: translateY(-8px); }
|
4700 |
+
}
|
4701 |
+
|
4702 |
+
@-o-keyframes float {
|
4703 |
+
100% { -o-transform: translateY(-8px); }
|
4704 |
+
}
|
4705 |
+
|
4706 |
+
@keyframes float {
|
4707 |
+
100% { transform: translateY(-8px); }
|
4708 |
+
}
|
4709 |
+
|
4710 |
+
.animated.float {
|
4711 |
+
-webkit-animation-name: float;
|
4712 |
+
-moz-animation-name: float;
|
4713 |
+
-o-animation-name: float;
|
4714 |
+
animation-name: float;
|
4715 |
+
}
|
4716 |
+
|
4717 |
+
/* Sink */
|
4718 |
+
@-webkit-keyframes sink {
|
4719 |
+
100% { -webkit-transform: translateY(8px); }
|
4720 |
+
}
|
4721 |
+
|
4722 |
+
@-moz-keyframes sink {
|
4723 |
+
100% { -moz-transform: translateY(8px); }
|
4724 |
+
}
|
4725 |
+
|
4726 |
+
@-o-keyframes sink {
|
4727 |
+
100% { -o-transform: translateY(8px); }
|
4728 |
+
}
|
4729 |
+
|
4730 |
+
@keyframes sink {
|
4731 |
+
100% { transform: translateY(8px); }
|
4732 |
+
}
|
4733 |
+
|
4734 |
+
.animated.sink {
|
4735 |
+
-webkit-animation-name: sink;
|
4736 |
+
-moz-animation-name: sink;
|
4737 |
+
-o-animation-name: sink;
|
4738 |
+
animation-name: sink;
|
4739 |
+
}
|
4740 |
+
|
4741 |
+
/* Skew */
|
4742 |
+
@-webkit-keyframes skew {
|
4743 |
+
100% { -webkit-transform: skew(-10deg); }
|
4744 |
+
}
|
4745 |
+
|
4746 |
+
@-moz-keyframes skew {
|
4747 |
+
100% { -moz-transform: skew(-10deg); }
|
4748 |
+
}
|
4749 |
+
|
4750 |
+
@-o-keyframes skew {
|
4751 |
+
100% { -o-transform: skew(-10deg); }
|
4752 |
+
}
|
4753 |
+
|
4754 |
+
@keyframes skew {
|
4755 |
+
100% { transform: skew(-10deg); }
|
4756 |
+
}
|
4757 |
+
|
4758 |
+
.animated.skew {
|
4759 |
+
-webkit-animation-name: skew;
|
4760 |
+
-moz-animation-name: skew;
|
4761 |
+
-o-animation-name: skew;
|
4762 |
+
animation-name: skew;
|
4763 |
+
}
|
4764 |
+
|
4765 |
+
/* Skew Forward */
|
4766 |
+
@-webkit-keyframes skewForward {
|
4767 |
+
100% { -webkit-transform: skew(-10deg); }
|
4768 |
+
}
|
4769 |
+
|
4770 |
+
@-moz-keyframes skewForward {
|
4771 |
+
100% { -moz-transform: skew(-10deg); }
|
4772 |
+
}
|
4773 |
+
|
4774 |
+
@-o-keyframes skewForward {
|
4775 |
+
100% { -o-transform: skew(-10deg); }
|
4776 |
+
}
|
4777 |
+
|
4778 |
+
@keyframes skewForward {
|
4779 |
+
100% { transform: skew(-10deg); }
|
4780 |
+
}
|
4781 |
+
|
4782 |
+
.animated.skewForward {
|
4783 |
+
-webkit-transform-origin: 0 100%;
|
4784 |
+
-moz-transform-origin: 0 100%;
|
4785 |
+
-o-transform-origin: 0 100%;
|
4786 |
+
transform-origin: 0 100%;
|
4787 |
+
-webkit-animation-name: skewForward;
|
4788 |
+
-moz-animation-name: skewForward;
|
4789 |
+
-o-animation-name: skewForward;
|
4790 |
+
animation-name: skewForward;
|
4791 |
+
}
|
4792 |
+
|
4793 |
+
/* Skew Backward */
|
4794 |
+
@-webkit-keyframes skewBackward {
|
4795 |
+
100% { -webkit-transform: skew(10deg); }
|
4796 |
+
}
|
4797 |
+
|
4798 |
+
@-moz-keyframes skewBackward {
|
4799 |
+
100% { -moz-transform: skew(10deg); }
|
4800 |
+
}
|
4801 |
+
|
4802 |
+
@-o-keyframes skewBackward {
|
4803 |
+
100% { -o-transform: skew(10deg); }
|
4804 |
+
}
|
4805 |
+
|
4806 |
+
@keyframes skewBackward {
|
4807 |
+
100% { transform: skew(10deg); }
|
4808 |
+
}
|
4809 |
+
|
4810 |
+
.animated.skewBackward {
|
4811 |
+
-webkit-transform-origin: 0 100%;
|
4812 |
+
-moz-transform-origin: 0 100%;
|
4813 |
+
-o-transform-origin: 0 100%;
|
4814 |
+
transform-origin: 0 100%;
|
4815 |
+
-webkit-animation-name: skewBackward;
|
4816 |
+
-moz-animation-name: skewBackward;
|
4817 |
+
-o-animation-name: skewBackward;
|
4818 |
+
animation-name: skewBackward;
|
4819 |
+
}
|
4820 |
+
|
4821 |
+
/* Wobble Vertical */
|
4822 |
+
@-webkit-keyframes wobbleVertical {
|
4823 |
+
16.65% { -webkit-transform: translateY(8px); }
|
4824 |
+
33.3% { -webkit-transform: translateY(-6px); }
|
4825 |
+
49.95% { -webkit-transform: translateY(4px); }
|
4826 |
+
66.6% { -webkit-transform: translateY(-2px); }
|
4827 |
+
83.25% { -webkit-transform: translateY(1px); }
|
4828 |
+
100% { -webkit-transform: translateY(0); }
|
4829 |
+
}
|
4830 |
+
|
4831 |
+
@-moz-keyframes wobbleVertical {
|
4832 |
+
16.65% { -moz-transform: translateY(8px); }
|
4833 |
+
33.3% { -moz-transform: translateY(-6px); }
|
4834 |
+
49.95% { -moz-transform: translateY(4px); }
|
4835 |
+
66.6% { -moz-transform: translateY(-2px); }
|
4836 |
+
83.25% { -moz-transform: translateY(1px); }
|
4837 |
+
100% { -moz-transform: translateY(0); }
|
4838 |
+
}
|
4839 |
+
|
4840 |
+
@-o-keyframes wobbleVertical {
|
4841 |
+
16.65% { -o-transform: translateY(8px); }
|
4842 |
+
33.3% { -o-transform: translateY(-6px); }
|
4843 |
+
49.95% { -o-transform: translateY(4px); }
|
4844 |
+
66.6% { -o-transform: translateY(-2px); }
|
4845 |
+
83.25% { -o-transform: translateY(1px); }
|
4846 |
+
100% { -o-transform: translateY(0); }
|
4847 |
+
}
|
4848 |
+
|
4849 |
+
@keyframes wobbleVertical {
|
4850 |
+
16.65% { transform: translateY(8px); }
|
4851 |
+
33.3% { transform: translateY(-6px); }
|
4852 |
+
49.95% { transform: translateY(4px); }
|
4853 |
+
66.6% { transform: translateY(-2px); }
|
4854 |
+
83.25% { transform: translateY(1px); }
|
4855 |
+
100% { transform: translateY(0); }
|
4856 |
+
}
|
4857 |
+
|
4858 |
+
.animated.wobbleVertical {
|
4859 |
+
-webkit-animation-name: wobbleVertical;
|
4860 |
+
-moz-animation-name: wobbleVertical;
|
4861 |
+
-o-animation-name: wobbleVertical;
|
4862 |
+
animation-name: wobbleVertical;
|
4863 |
+
}
|
4864 |
+
|
4865 |
+
/* Wobble Horizontal */
|
4866 |
+
@-webkit-keyframes wobbleHorizontal {
|
4867 |
+
16.65% { -webkit-transform: translateX(8px); }
|
4868 |
+
33.3% { -webkit-transform: translateX(-6px); }
|
4869 |
+
49.95% { -webkit-transform: translateX(4px); }
|
4870 |
+
66.6% { -webkit-transform: translateX(-2px); }
|
4871 |
+
83.25% { -webkit-transform: translateX(1px); }
|
4872 |
+
100% { -webkit-transform: translateX(0); }
|
4873 |
+
}
|
4874 |
+
|
4875 |
+
@-moz-keyframes wobbleHorizontal {
|
4876 |
+
16.65% { -moz-transform: translateX(8px); }
|
4877 |
+
33.3% { -moz-transform: translateX(-6px); }
|
4878 |
+
49.95% { -moz-transform: translateX(4px); }
|
4879 |
+
66.6% { -moz-transform: translateX(-2px); }
|
4880 |
+
83.25% { -moz-transform: translateX(1px); }
|
4881 |
+
100% { -moz-transform: translateX(0); }
|
4882 |
+
}
|
4883 |
+
|
4884 |
+
@-o-keyframes wobbleHorizontal {
|
4885 |
+
16.65% { -o-transform: translateX(8px); }
|
4886 |
+
33.3% { -o-transform: translateX(-6px); }
|
4887 |
+
49.95% { -o-transform: translateX(4px); }
|
4888 |
+
66.6% { -o-transform: translateX(-2px); }
|
4889 |
+
83.25% { -o-transform: translateX(1px); }
|
4890 |
+
100% { -o-transform: translateX(0); }
|
4891 |
+
}
|
4892 |
+
|
4893 |
+
@keyframes wobbleHorizontal {
|
4894 |
+
16.65% { transform: translateX(8px); }
|
4895 |
+
33.3% { transform: translateX(-6px); }
|
4896 |
+
49.95% { transform: translateX(4px); }
|
4897 |
+
66.6% { transform: translateX(-2px); }
|
4898 |
+
83.25% { transform: translateX(1px); }
|
4899 |
+
100% { transform: translateX(0); }
|
4900 |
+
}
|
4901 |
+
|
4902 |
+
.animated.wobbleHorizontal {
|
4903 |
+
-webkit-animation-name: wobbleHorizontal;
|
4904 |
+
-moz-animation-name: wobbleHorizontal;
|
4905 |
+
-o-animation-name: wobbleHorizontal;
|
4906 |
+
animation-name: wobbleHorizontal;
|
4907 |
+
}
|
4908 |
+
|
4909 |
+
/* Wobble To Bottom Right */
|
4910 |
+
@-webkit-keyframes wobbleToBottomRight {
|
4911 |
+
16.65% { -webkit-transform: translate(8px, 8px); }
|
4912 |
+
33.3% { -webkit-transform: translate(-6px, -6px); }
|
4913 |
+
49.95% { -webkit-transform: translate(4px, 4px); }
|
4914 |
+
66.6% { -webkit-transform: translate(-2px, -2px); }
|
4915 |
+
83.25% { -webkit-transform: translate(1px, 1px); }
|
4916 |
+
100% { -webkit-transform: translate(0, 0); }
|
4917 |
+
}
|
4918 |
+
|
4919 |
+
@-moz-keyframes wobbleToBottomRight {
|
4920 |
+
16.65% { -moz-transform: translate(8px, 8px); }
|
4921 |
+
33.3% { -moz-transform: translate(-6px, -6px); }
|
4922 |
+
49.95% { -moz-transform: translate(4px, 4px); }
|
4923 |
+
66.6% { -moz-transform: translate(-2px, -2px); }
|
4924 |
+
83.25% { -moz-transform: translate(1px, 1px); }
|
4925 |
+
100% { -moz-transform: translate(0, 0); }
|
4926 |
+
}
|
4927 |
+
|
4928 |
+
@-o-keyframes wobbleToBottomRight {
|
4929 |
+
16.65% { -o-transform: translate(8px, 8px); }
|
4930 |
+
33.3% { -o-transform: translate(-6px, -6px); }
|
4931 |
+
49.95% { -o-transform: translate(4px, 4px); }
|
4932 |
+
66.6% { -o-transform: translate(-2px, -2px); }
|
4933 |
+
83.25% { -o-transform: translate(1px, 1px); }
|
4934 |
+
100% { -o-transform: translate(0, 0); }
|
4935 |
+
}
|
4936 |
+
|
4937 |
+
@keyframes wobbleToBottomRight {
|
4938 |
+
16.65% { transform: translate(8px, 8px); }
|
4939 |
+
33.3% { transform: translate(-6px, -6px); }
|
4940 |
+
49.95% { transform: translate(4px, 4px); }
|
4941 |
+
66.6% { transform: translate(-2px, -2px); }
|
4942 |
+
83.25% { transform: translate(1px, 1px); }
|
4943 |
+
100% { transform: translate(0, 0); }
|
4944 |
+
}
|
4945 |
+
|
4946 |
+
.animated.wobbleToBottomRight {
|
4947 |
+
-webkit-animation-name: wobbleToBottomRight;
|
4948 |
+
-moz-animation-name: wobbleToBottomRight;
|
4949 |
+
-o-animation-name: wobbleToBottomRight;
|
4950 |
+
animation-name: wobbleToBottomRight;
|
4951 |
+
}
|
4952 |
+
|
4953 |
+
/* Wobble To Top Right */
|
4954 |
+
@-webkit-keyframes wobbleToTopRight {
|
4955 |
+
16.65% { -webkit-transform: translate(8px, -8px); }
|
4956 |
+
33.3% { -webkit-transform: translate(-6px, 6px); }
|
4957 |
+
49.95% { -webkit-transform: translate(4px, -4px); }
|
4958 |
+
66.6% { -webkit-transform: translate(-2px, 2px); }
|
4959 |
+
83.25% { -webkit-transform: translate(1px, -1px); }
|
4960 |
+
100% { -webkit-transform: translate(0, 0); }
|
4961 |
+
}
|
4962 |
+
|
4963 |
+
@-moz-keyframes wobbleToTopRight {
|
4964 |
+
16.65% { -moz-transform: translate(8px, -8px); }
|
4965 |
+
33.3% { -moz-transform: translate(-6px, 6px); }
|
4966 |
+
49.95% { -moz-transform: translate(4px, -4px); }
|
4967 |
+
66.6% { -moz-transform: translate(-2px, 2px); }
|
4968 |
+
83.25% { -moz-transform: translate(1px, -1px); }
|
4969 |
+
100% { -moz-transform: translate(0, 0); }
|
4970 |
+
}
|
4971 |
+
|
4972 |
+
@-o-keyframes wobbleToTopRight {
|
4973 |
+
16.65% { -o-transform: translate(8px, -8px); }
|
4974 |
+
33.3% { -o-transform: translate(-6px, 6px); }
|
4975 |
+
49.95% { -o-transform: translate(4px, -4px); }
|
4976 |
+
66.6% { -o-transform: translate(-2px, 2px); }
|
4977 |
+
83.25% { -o-transform: translate(1px, -1px); }
|
4978 |
+
100% { -o-transform: translate(0, 0); }
|
4979 |
+
}
|
4980 |
+
|
4981 |
+
@keyframes wobbleToTopRight {
|
4982 |
+
16.65% { transform: translate(8px, -8px); }
|
4983 |
+
33.3% { transform: translate(-6px, 6px); }
|
4984 |
+
49.95% { transform: translate(4px, -4px); }
|
4985 |
+
66.6% { transform: translate(-2px, 2px); }
|
4986 |
+
83.25% { transform: translate(1px, -1px); }
|
4987 |
+
100% { transform: translate(0, 0); }
|
4988 |
+
}
|
4989 |
+
|
4990 |
+
.animated.wobbleToTopRight {
|
4991 |
+
-webkit-animation-name: wobbleToTopRight;
|
4992 |
+
-moz-animation-name: wobbleToTopRight;
|
4993 |
+
-o-animation-name: wobbleToTopRight;
|
4994 |
+
animation-name: wobbleToTopRight;
|
4995 |
+
}
|
4996 |
+
|
4997 |
+
/* Wobble Top */
|
4998 |
+
@-webkit-keyframes wobbleTop {
|
4999 |
+
16.65% { -webkit-transform: skew(-12deg); }
|
5000 |
+
33.3% { -webkit-transform: skew(10deg); }
|
5001 |
+
49.95% { -webkit-transform: skew(-6deg); }
|
5002 |
+
66.6% { -webkit-transform: skew(4deg); }
|
5003 |
+
83.25% { -webkit-transform: skew(-2deg); }
|
5004 |
+
100% { -webkit-transform: skew(0); }
|
5005 |
+
}
|
5006 |
+
|
5007 |
+
@-moz-keyframes wobbleTop {
|
5008 |
+
16.65% { -moz-transform: skew(-12deg); }
|
5009 |
+
33.3% { -moz-transform: skew(10deg); }
|
5010 |
+
49.95% { -moz-transform: skew(-6deg); }
|
5011 |
+
66.6% { -moz-transform: skew(4deg); }
|
5012 |
+
83.25% { -moz-transform: skew(-2deg); }
|
5013 |
+
100% { -moz-transform: skew(0); }
|
5014 |
+
}
|
5015 |
+
|
5016 |
+
@-o-keyframes wobbleTop {
|
5017 |
+
16.65% { -o-transform: skew(-12deg); }
|
5018 |
+
33.3% { -o-transform: skew(10deg); }
|
5019 |
+
49.95% { -o-transform: skew(-6deg); }
|
5020 |
+
66.6% { -o-transform: skew(4deg); }
|
5021 |
+
83.25% { -o-transform: skew(-2deg); }
|
5022 |
+
100% { -o-transform: skew(0); }
|
5023 |
+
}
|
5024 |
+
|
5025 |
+
@keyframes wobbleTop {
|
5026 |
+
16.65% { transform: skew(-12deg); }
|
5027 |
+
33.3% { transform: skew(10deg); }
|
5028 |
+
49.95% { transform: skew(-6deg); }
|
5029 |
+
66.6% { transform: skew(4deg); }
|
5030 |
+
83.25% { transform: skew(-2deg); }
|
5031 |
+
100% { transform: skew(0); }
|
5032 |
+
}
|
5033 |
+
|
5034 |
+
.animated.wobbleTop {
|
5035 |
+
-webkit-transform-origin: 0 100%;
|
5036 |
+
-moz-transform-origin: 0 100%;
|
5037 |
+
-o-transform-origin: 0 100%;
|
5038 |
+
transform-origin: 0 100%;
|
5039 |
+
-webkit-animation-name: wobbleTop;
|
5040 |
+
-moz-animation-name: wobbleTop;
|
5041 |
+
-o-animation-name: wobbleTop;
|
5042 |
+
animation-name: wobbleTop;
|
5043 |
+
}
|
5044 |
+
|
5045 |
+
/* Wobble Bottom */
|
5046 |
+
@-webkit-keyframes wobbleBottom {
|
5047 |
+
16.65% { -webkit-transform: skew(-12deg); }
|
5048 |
+
33.3% { -webkit-transform: skew(10deg); }
|
5049 |
+
49.95% { -webkit-transform: skew(-6deg); }
|
5050 |
+
66.6% { -webkit-transform: skew(4deg); }
|
5051 |
+
83.25% { -webkit-transform: skew(-2deg); }
|
5052 |
+
100% { -webkit-transform: skew(0); }
|
5053 |
+
}
|
5054 |
+
|
5055 |
+
@-moz-keyframes wobbleBottom {
|
5056 |
+
16.65% { -moz-transform: skew(-12deg); }
|
5057 |
+
33.3% { -moz-transform: skew(10deg); }
|
5058 |
+
49.95% { -moz-transform: skew(-6deg); }
|
5059 |
+
66.6% { -moz-transform: skew(4deg); }
|
5060 |
+
83.25% { -moz-transform: skew(-2deg); }
|
5061 |
+
100% { -moz-transform: skew(0); }
|
5062 |
+
}
|
5063 |
+
|
5064 |
+
@-o-keyframes wobbleBottom {
|
5065 |
+
16.65% { -o-transform: skew(-12deg); }
|
5066 |
+
33.3% { -o-transform: skew(10deg); }
|
5067 |
+
49.95% { -o-transform: skew(-6deg); }
|
5068 |
+
66.6% { -o-transform: skew(4deg); }
|
5069 |
+
83.25% { -o-transform: skew(-2deg); }
|
5070 |
+
100% { -o-transform: skew(0); }
|
5071 |
+
}
|
5072 |
+
|
5073 |
+
@keyframes wobbleBottom {
|
5074 |
+
16.65% { transform: skew(-12deg); }
|
5075 |
+
33.3% { transform: skew(10deg); }
|
5076 |
+
49.95% { transform: skew(-6deg); }
|
5077 |
+
66.6% { transform: skew(4deg); }
|
5078 |
+
83.25% { transform: skew(-2deg); }
|
5079 |
+
100% { transform: skew(0); }
|
5080 |
+
}
|
5081 |
+
|
5082 |
+
.animated.wobbleBottom {
|
5083 |
+
-webkit-transform-origin: 100% 0;
|
5084 |
+
-moz-transform-origin: 100% 0;
|
5085 |
+
-o-transform-origin: 100% 0;
|
5086 |
+
transform-origin: 100% 0;
|
5087 |
+
-webkit-animation-name: wobbleBottom;
|
5088 |
+
-moz-animation-name: wobbleBottom;
|
5089 |
+
-o-animation-name: wobbleBottom;
|
5090 |
+
animation-name: wobbleBottom;
|
5091 |
+
}
|
5092 |
+
|
5093 |
+
/* Wobble Skew */
|
5094 |
+
@-webkit-keyframes wobbleSkew {
|
5095 |
+
16.65% { -webkit-transform: skew(-12deg); }
|
5096 |
+
33.3% { -webkit-transform: skew(10deg); }
|
5097 |
+
49.95% { -webkit-transform: skew(-6deg); }
|
5098 |
+
66.6% { -webkit-transform: skew(4deg); }
|
5099 |
+
83.25% { -webkit-transform: skew(-2deg); }
|
5100 |
+
100% { -webkit-transform: skew(0); }
|
5101 |
+
}
|
5102 |
+
|
5103 |
+
@-moz-keyframes wobbleSkew {
|
5104 |
+
16.65% { -moz-transform: skew(-12deg); }
|
5105 |
+
33.3% { -moz-transform: skew(10deg); }
|
5106 |
+
49.95% { -moz-transform: skew(-6deg); }
|
5107 |
+
66.6% { -moz-transform: skew(4deg); }
|
5108 |
+
83.25% { -moz-transform: skew(-2deg); }
|
5109 |
+
100% { -moz-transform: skew(0); }
|
5110 |
+
}
|
5111 |
+
|
5112 |
+
@-o-keyframes wobbleSkew {
|
5113 |
+
16.65% { -o-transform: skew(-12deg); }
|
5114 |
+
33.3% { -o-transform: skew(10deg); }
|
5115 |
+
49.95% { -o-transform: skew(-6deg); }
|
5116 |
+
66.6% { -o-transform: skew(4deg); }
|
5117 |
+
83.25% { -o-transform: skew(-2deg); }
|
5118 |
+
100% { -o-transform: skew(0); }
|
5119 |
+
}
|
5120 |
+
|
5121 |
+
@keyframes wobbleSkew {
|
5122 |
+
16.65% { transform: skew(-12deg); }
|
5123 |
+
33.3% { transform: skew(10deg); }
|
5124 |
+
49.95% { transform: skew(-6deg); }
|
5125 |
+
66.6% { transform: skew(4deg); }
|
5126 |
+
83.25% { transform: skew(-2deg); }
|
5127 |
+
100% { transform: skew(0); }
|
5128 |
+
}
|
5129 |
+
|
5130 |
+
.animated.wobbleSkew {
|
5131 |
+
-webkit-animation-name: wobbleSkew;
|
5132 |
+
-moz-animation-name: wobbleSkew;
|
5133 |
+
-o-animation-name: wobbleSkew;
|
5134 |
+
animation-name: wobbleSkew;
|
5135 |
+
}
|
5136 |
+
|
5137 |
+
/* Buzz */
|
5138 |
+
@-webkit-keyframes buzz {
|
5139 |
+
50% { -webkit-transform: translateX(3px) rotate(2deg); }
|
5140 |
+
100% { -webkit-transform: translateX(-3px) rotate(-2deg); }
|
5141 |
+
}
|
5142 |
+
|
5143 |
+
@-moz-keyframes buzz {
|
5144 |
+
50% { -moz-transform: translateX(3px) rotate(2deg); }
|
5145 |
+
100% { -moz-transform: translateX(-3px) rotate(-2deg); }
|
5146 |
+
}
|
5147 |
+
|
5148 |
+
@-o-keyframes buzz {
|
5149 |
+
50% { -o-transform: translateX(3px) rotate(2deg); }
|
5150 |
+
100% { -o-transform: translateX(-3px) rotate(-2deg); }
|
5151 |
+
}
|
5152 |
+
|
5153 |
+
@keyframes buzz {
|
5154 |
+
50% { transform: translateX(3px) rotate(2deg); }
|
5155 |
+
100% { transform: translateX(-3px) rotate(-2deg); }
|
5156 |
+
}
|
5157 |
+
|
5158 |
+
.animated.buzz {
|
5159 |
+
-webkit-animation-name: buzz;
|
5160 |
+
-moz-animation-name: buzz;
|
5161 |
+
-o-animation-name: buzz;
|
5162 |
+
animation-name: buzz;
|
5163 |
+
-webkit-animation-iteration-count: infinite;
|
5164 |
+
animation-iteration-count: infinite;
|
5165 |
+
}
|
5166 |
+
|
5167 |
+
/* Buzz Out */
|
5168 |
+
@-webkit-keyframes buzzOut {
|
5169 |
+
10% { -webkit-transform: translateX(3px) rotate(2deg); }
|
5170 |
+
20% { -webkit-transform: translateX(-3px) rotate(-2deg); }
|
5171 |
+
30% { -webkit-transform: translateX(3px) rotate(2deg); }
|
5172 |
+
40% { -webkit-transform: translateX(-3px) rotate(-2deg); }
|
5173 |
+
50% { -webkit-transform: translateX(2px) rotate(1deg); }
|
5174 |
+
60% { -webkit-transform: translateX(-2px) rotate(-1deg); }
|
5175 |
+
70% { -webkit-transform: translateX(2px) rotate(1deg); }
|
5176 |
+
80% { -webkit-transform: translateX(-2px) rotate(-1deg); }
|
5177 |
+
90% { -webkit-transform: translateX(1px) rotate(0); }
|
5178 |
+
100% { -webkit-transform: translateX(-1px) rotate(0); }
|
5179 |
+
}
|
5180 |
+
|
5181 |
+
@-moz-keyframes buzzOut {
|
5182 |
+
10% { -moz-transform: translateX(3px) rotate(2deg); }
|
5183 |
+
20% { -moz-transform: translateX(-3px) rotate(-2deg); }
|
5184 |
+
30% { -moz-transform: translateX(3px) rotate(2deg); }
|
5185 |
+
40% { -moz-transform: translateX(-3px) rotate(-2deg); }
|
5186 |
+
50% { -moz-transform: translateX(2px) rotate(1deg); }
|
5187 |
+
60% { -moz-transform: translateX(-2px) rotate(-1deg); }
|
5188 |
+
70% { -moz-transform: translateX(2px) rotate(1deg); }
|
5189 |
+
80% { -moz-transform: translateX(-2px) rotate(-1deg); }
|
5190 |
+
90% { -moz-transform: translateX(1px) rotate(0); }
|
5191 |
+
100% { -moz-transform: translateX(-1px) rotate(0); }
|
5192 |
+
}
|
5193 |
+
|
5194 |
+
@-o-keyframes buzzOut {
|
5195 |
+
10% { -o-transform: translateX(3px) rotate(2deg); }
|
5196 |
+
20% { -o-transform: translateX(-3px) rotate(-2deg); }
|
5197 |
+
30% { -o-transform: translateX(3px) rotate(2deg); }
|
5198 |
+
40% { -o-transform: translateX(-3px) rotate(-2deg); }
|
5199 |
+
50% { -o-transform: translateX(2px) rotate(1deg); }
|
5200 |
+
60% { -o-transform: translateX(-2px) rotate(-1deg); }
|
5201 |
+
70% { -o-transform: translateX(2px) rotate(1deg); }
|
5202 |
+
80% { -o-transform: translateX(-2px) rotate(-1deg); }
|
5203 |
+
90% { -o-transform: translateX(1px) rotate(0); }
|
5204 |
+
100% { -o-transform: translateX(-1px) rotate(0); }
|
5205 |
+
}
|
5206 |
+
|
5207 |
+
@keyframes buzzOut {
|
5208 |
+
10% { transform: translateX(3px) rotate(2deg); }
|
5209 |
+
20% { transform: translateX(-3px) rotate(-2deg); }
|
5210 |
+
30% { transform: translateX(3px) rotate(2deg); }
|
5211 |
+
40% { transform: translateX(-3px) rotate(-2deg); }
|
5212 |
+
50% { transform: translateX(2px) rotate(1deg); }
|
5213 |
+
60% { transform: translateX(-2px) rotate(-1deg); }
|
5214 |
+
70% { transform: translateX(2px) rotate(1deg); }
|
5215 |
+
80% { transform: translateX(-2px) rotate(-1deg); }
|
5216 |
+
90% { transform: translateX(1px) rotate(0); }
|
5217 |
+
100% { transform: translateX(-1px) rotate(0); }
|
5218 |
+
}
|
5219 |
+
|
5220 |
+
.animated.buzzOut {
|
5221 |
+
-webkit-animation-name: buzzOut;
|
5222 |
+
-moz-animation-name: buzzOut;
|
5223 |
+
-o-animation-name: buzzOut;
|
5224 |
+
animation-name: buzzOut;
|
5225 |
+
}
|
5226 |
+
|
5227 |
+
/* Forward */
|
5228 |
+
@-webkit-keyframes forward {
|
5229 |
+
100% { -webkit-transform: translateX(8px); }
|
5230 |
+
}
|
5231 |
+
|
5232 |
+
@-moz-keyframes forward {
|
5233 |
+
100% { -moz-transform: translateX(8px); }
|
5234 |
+
}
|
5235 |
+
|
5236 |
+
@-o-keyframes forward {
|
5237 |
+
100% { -o-transform: translateX(8px); }
|
5238 |
+
}
|
5239 |
+
|
5240 |
+
@keyframes forward {
|
5241 |
+
100% { transform: translateX(8px); }
|
5242 |
+
}
|
5243 |
+
|
5244 |
+
.animated.forward {
|
5245 |
+
-webkit-animation-name: forward;
|
5246 |
+
-moz-animation-name: forward;
|
5247 |
+
-o-animation-name: forward;
|
5248 |
+
animation-name: forward;
|
5249 |
+
}
|
5250 |
+
|
5251 |
+
/* Backward */
|
5252 |
+
@-webkit-keyframes backward {
|
5253 |
+
100% { -webkit-transform: translateX(-8px); }
|
5254 |
+
}
|
5255 |
+
|
5256 |
+
@-moz-keyframes backward {
|
5257 |
+
100% { -moz-transform: translateX(-8px); }
|
5258 |
+
}
|
5259 |
+
|
5260 |
+
@-o-keyframes backward {
|
5261 |
+
100% { -o-transform: translateX(-8px); }
|
5262 |
+
}
|
5263 |
+
|
5264 |
+
@keyframes backward {
|
5265 |
+
100% { transform: translateX(-8px); }
|
5266 |
+
}
|
5267 |
+
|
5268 |
+
.animated.backward {
|
5269 |
+
-webkit-animation-name: backward;
|
5270 |
+
-moz-animation-name: backward;
|
5271 |
+
-o-animation-name: backward;
|
5272 |
+
animation-name: backward;
|
5273 |
+
}
|
assets/css/blank.css
ADDED
@@ -0,0 +1,2 @@
|
|
|
|
|
1 |
+
/*blank CSS just to create a handle for custom css file */
|
2 |
+
body{}
|
assets/helper/edsanimate-tinymce-popup.php
CHANGED
@@ -1,748 +1,828 @@
|
|
1 |
-
<?php
|
2 |
-
$scroll_offset = get_option ( 'eds_scroll_offset', '75' );
|
3 |
-
?>
|
4 |
-
<!doctype html>
|
5 |
-
<html lang="en">
|
6 |
-
<head>
|
7 |
-
<meta charset="utf-8">
|
8 |
-
<title><?php _e( 'Select your Animation Style', 'eds-animate' ); ?>:</title>
|
9 |
-
<meta name="viewport"
|
10 |
-
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
11 |
-
<link rel="stylesheet"
|
12 |
-
href="<?php echo plugin_dir_url(__FILE__).'../css/animate-animo.css'; ?>" />
|
13 |
-
<link rel="stylesheet"
|
14 |
-
href="<?php echo plugin_dir_url(__FILE__).'../css/style.css'; ?>" />
|
15 |
-
</head>
|
16 |
-
<body
|
17 |
-
onload="document.body.style.display='';"
|
18 |
-
dir="ltr">
|
19 |
-
<div class="modal edsai-wrapper">
|
20 |
-
<div class="edaai-body">
|
21 |
-
<div class="preview-badge">
|
22 |
-
<span id="animationSandbox">
|
23 |
-
<h1 class="site__title mega animateit-icon"></h1>
|
24 |
-
</span>
|
25 |
-
</div>
|
26 |
-
<form name="edsanimate_form" id="edsanimate_form">
|
27 |
-
<div class="edsai-form-wrapper">
|
28 |
-
<div class="edsai-tabs">
|
29 |
-
<div class="edsai-tab edsai-tab-active">
|
30 |
-
<a class="edsai-tab-handler" href="#tab-entry"><?php _e( 'Entry', 'eds-animate' ); ?></a>
|
31 |
-
</div>
|
32 |
-
<div class="edsai-tab">
|
33 |
-
<a class="edsai-tab-handler" href="#tab-exit"><?php _e( 'Exit', 'eds-animate' ); ?></a>
|
34 |
-
</div>
|
35 |
-
<div class="edsai-tab">
|
36 |
-
<a class="edsai-tab-handler" href="#tab-options"><?php _e( 'Options', 'eds-animate' ); ?></a>
|
37 |
-
</div>
|
38 |
-
</div>
|
39 |
-
<div id="tab-entry" class="edsai-tab-content edsai-entry"
|
40 |
-
style="display: block;">
|
41 |
-
<div class="edsai-form-control-wrapper">
|
42 |
-
<label for="entry-animation-type"><?php _e( 'Animation', 'eds-animate' ); ?>:</label>
|
43 |
-
<div class="edsai-form-control">
|
44 |
-
<select id="entry-animation-type" name="entry-animation-type"
|
45 |
-
class="full-size">
|
46 |
-
<option value="none"><?php _e( 'None', 'eds-animate' ); ?></option>
|
47 |
-
<optgroup label="Bouncing Entrances">
|
48 |
-
<option value="bounceIn">bounceIn</option>
|
49 |
-
<option value="bounceInDown">bounceInDown</option>
|
50 |
-
<option value="bounceInLeft">bounceInLeft</option>
|
51 |
-
<option value="bounceInRight">bounceInRight</option>
|
52 |
-
<option value="bounceInUp">bounceInUp</option>
|
53 |
-
</optgroup>
|
54 |
-
<optgroup label="Fading Entrances">
|
55 |
-
<option value="fadeIn" selected>fadeIn</option>
|
56 |
-
<option value="fadeInDown">fadeInDown</option>
|
57 |
-
<option value="fadeInDownBig">fadeInDownBig</option>
|
58 |
-
<option value="fadeInLeft">fadeInLeft</option>
|
59 |
-
<option value="fadeInLeftBig">fadeInLeftBig</option>
|
60 |
-
<option value="fadeInRight">fadeInRight</option>
|
61 |
-
<option value="fadeInRightBig">fadeInRightBig</option>
|
62 |
-
<option value="fadeInUp">fadeInUp</option>
|
63 |
-
<option value="fadeInUpBig">fadeInUpBig</option>
|
64 |
-
</optgroup>
|
65 |
-
<optgroup label="Rotating Entrances">
|
66 |
-
<option value="rotateIn">rotateIn</option>
|
67 |
-
<option value="rotateInDownLeft">rotateInDownLeft</option>
|
68 |
-
<option value="rotateInDownRight">rotateInDownRight</option>
|
69 |
-
<option value="rotateInUpLeft">rotateInUpLeft</option>
|
70 |
-
<option value="rotateInUpRight">rotateInUpRight</option>
|
71 |
-
</optgroup>
|
72 |
-
<optgroup label="Sliding Entrances">
|
73 |
-
<option value="slideInUp">slideInUp</option>
|
74 |
-
<option value="slideInDown">slideInDown</option>
|
75 |
-
<option value="slideInLeft">slideInLeft</option>
|
76 |
-
<option value="slideInRight">slideInRight</option>
|
77 |
-
</optgroup>
|
78 |
-
<optgroup label="Zoom Entrances">
|
79 |
-
<option value="zoomIn">zoomIn</option>
|
80 |
-
<option value="zoomInDown">zoomInDown</option>
|
81 |
-
<option value="zoomInLeft">zoomInLeft</option>
|
82 |
-
<option value="zoomInRight">zoomInRight</option>
|
83 |
-
<option value="zoomInUp">zoomInUp</option>
|
84 |
-
</optgroup>
|
85 |
-
<optgroup label="Attention Seekers">
|
86 |
-
<option value="spinner">Spin</option>
|
87 |
-
<option value="bounce">bounce</option>
|
88 |
-
<option value="flash">flash</option>
|
89 |
-
<option value="
|
90 |
-
<option value="
|
91 |
-
<option value="
|
92 |
-
<option value="
|
93 |
-
<option value="
|
94 |
-
<option value="
|
95 |
-
<option value="
|
96 |
-
|
97 |
-
|
98 |
-
<option value="
|
99 |
-
<option value="
|
100 |
-
<option value="
|
101 |
-
|
102 |
-
|
103 |
-
<option value="
|
104 |
-
|
105 |
-
|
106 |
-
|
107 |
-
|
108 |
-
|
109 |
-
|
110 |
-
|
111 |
-
|
112 |
-
|
113 |
-
|
114 |
-
|
115 |
-
|
116 |
-
|
117 |
-
|
118 |
-
|
119 |
-
|
120 |
-
|
121 |
-
<
|
122 |
-
|
123 |
-
|
124 |
-
|
125 |
-
|
126 |
-
|
127 |
-
|
128 |
-
|
129 |
-
|
130 |
-
<
|
131 |
-
|
132 |
-
|
133 |
-
|
134 |
-
|
135 |
-
|
136 |
-
|
137 |
-
|
138 |
-
|
139 |
-
|
140 |
-
|
141 |
-
|
142 |
-
<
|
143 |
-
|
144 |
-
|
145 |
-
<
|
146 |
-
|
147 |
-
|
148 |
-
|
149 |
-
|
150 |
-
|
151 |
-
|
152 |
-
|
153 |
-
|
154 |
-
|
155 |
-
|
156 |
-
|
157 |
-
|
158 |
-
|
159 |
-
|
160 |
-
|
161 |
-
|
162 |
-
|
163 |
-
|
164 |
-
<option value="
|
165 |
-
<option value="
|
166 |
-
<option value="
|
167 |
-
<option value="
|
168 |
-
<option value="
|
169 |
-
<option value="
|
170 |
-
<option value="
|
171 |
-
|
172 |
-
|
173 |
-
|
174 |
-
|
175 |
-
|
176 |
-
|
177 |
-
|
178 |
-
|
179 |
-
|
180 |
-
|
181 |
-
<option value="
|
182 |
-
<option value="
|
183 |
-
<option value="
|
184 |
-
<option value="
|
185 |
-
<option value="
|
186 |
-
<option value="
|
187 |
-
<option value="
|
188 |
-
<option value="
|
189 |
-
<option value="
|
190 |
-
<option value="
|
191 |
-
<option value="
|
192 |
-
<option value="
|
193 |
-
|
194 |
-
|
195 |
-
|
196 |
-
|
197 |
-
|
198 |
-
|
199 |
-
|
200 |
-
<
|
201 |
-
|
202 |
-
|
203 |
-
|
204 |
-
<
|
205 |
-
|
206 |
-
|
207 |
-
|
208 |
-
|
209 |
-
|
210 |
-
</
|
211 |
-
<
|
212 |
-
|
213 |
-
|
214 |
-
|
215 |
-
|
216 |
-
|
217 |
-
|
218 |
-
|
219 |
-
|
220 |
-
|
221 |
-
</
|
222 |
-
<
|
223 |
-
|
224 |
-
|
225 |
-
|
226 |
-
|
227 |
-
|
228 |
-
</
|
229 |
-
<
|
230 |
-
|
231 |
-
|
232 |
-
|
233 |
-
|
234 |
-
|
235 |
-
|
236 |
-
|
237 |
-
|
238 |
-
|
239 |
-
|
240 |
-
|
241 |
-
|
242 |
-
|
243 |
-
|
244 |
-
|
245 |
-
<option value="
|
246 |
-
<option value="
|
247 |
-
<option value="
|
248 |
-
<option value="
|
249 |
-
<option value="
|
250 |
-
|
251 |
-
|
252 |
-
<option value="
|
253 |
-
|
254 |
-
|
255 |
-
<option value="
|
256 |
-
<option value="
|
257 |
-
<option value="
|
258 |
-
|
259 |
-
|
260 |
-
<option value="
|
261 |
-
</optgroup>
|
262 |
-
<optgroup label="
|
263 |
-
<option value="
|
264 |
-
<option value="
|
265 |
-
|
266 |
-
|
267 |
-
|
268 |
-
|
269 |
-
|
270 |
-
|
271 |
-
|
272 |
-
|
273 |
-
|
274 |
-
|
275 |
-
<
|
276 |
-
|
277 |
-
|
278 |
-
|
279 |
-
|
280 |
-
|
281 |
-
|
282 |
-
<
|
283 |
-
|
284 |
-
|
285 |
-
|
286 |
-
|
287 |
-
|
288 |
-
|
289 |
-
|
290 |
-
|
291 |
-
|
292 |
-
|
293 |
-
|
294 |
-
|
295 |
-
|
296 |
-
|
297 |
-
|
298 |
-
|
299 |
-
|
300 |
-
|
301 |
-
|
302 |
-
|
303 |
-
|
304 |
-
<
|
305 |
-
|
306 |
-
|
307 |
-
|
308 |
-
|
309 |
-
<
|
310 |
-
|
311 |
-
|
312 |
-
|
313 |
-
|
314 |
-
|
315 |
-
|
316 |
-
|
317 |
-
|
318 |
-
|
319 |
-
|
320 |
-
|
321 |
-
|
322 |
-
|
323 |
-
|
324 |
-
|
325 |
-
|
326 |
-
|
327 |
-
<
|
328 |
-
|
329 |
-
|
330 |
-
|
331 |
-
<
|
332 |
-
|
333 |
-
|
334 |
-
|
335 |
-
|
336 |
-
<
|
337 |
-
|
338 |
-
|
339 |
-
<
|
340 |
-
|
341 |
-
|
342 |
-
<
|
343 |
-
|
344 |
-
|
345 |
-
|
346 |
-
|
347 |
-
|
348 |
-
|
349 |
-
|
350 |
-
|
351 |
-
|
352 |
-
|
353 |
-
|
354 |
-
|
355 |
-
|
356 |
-
|
357 |
-
|
358 |
-
|
359 |
-
|
360 |
-
<option value="
|
361 |
-
<option value="
|
362 |
-
<option value="
|
363 |
-
<option value="
|
364 |
-
<option value="
|
365 |
-
|
366 |
-
|
367 |
-
|
368 |
-
|
369 |
-
|
370 |
-
|
371 |
-
|
372 |
-
|
373 |
-
|
374 |
-
|
375 |
-
|
376 |
-
|
377 |
-
|
378 |
-
|
379 |
-
|
380 |
-
|
381 |
-
|
382 |
-
|
383 |
-
|
384 |
-
|
385 |
-
|
386 |
-
|
387 |
-
|
388 |
-
|
389 |
-
|
390 |
-
|
391 |
-
|
392 |
-
|
393 |
-
|
394 |
-
|
395 |
-
|
396 |
-
|
397 |
-
|
398 |
-
|
399 |
-
|
400 |
-
|
401 |
-
|
402 |
-
|
403 |
-
|
404 |
-
|
405 |
-
|
406 |
-
value="
|
407 |
-
|
408 |
-
|
409 |
-
|
410 |
-
|
411 |
-
|
412 |
-
|
413 |
-
|
414 |
-
|
415 |
-
|
416 |
-
|
417 |
-
|
418 |
-
|
419 |
-
|
420 |
-
|
421 |
-
|
422 |
-
|
423 |
-
|
424 |
-
|
425 |
-
|
426 |
-
|
427 |
-
|
428 |
-
|
429 |
-
|
430 |
-
|
431 |
-
|
432 |
-
|
433 |
-
|
434 |
-
|
435 |
-
|
436 |
-
|
437 |
-
|
438 |
-
|
439 |
-
|
440 |
-
|
441 |
-
|
442 |
-
|
443 |
-
|
444 |
-
|
445 |
-
|
446 |
-
|
447 |
-
|
448 |
-
|
449 |
-
|
450 |
-
|
451 |
-
|
452 |
-
|
453 |
-
|
454 |
-
|
455 |
-
|
456 |
-
|
457 |
-
|
458 |
-
|
459 |
-
|
460 |
-
|
461 |
-
|
462 |
-
|
463 |
-
|
464 |
-
|
465 |
-
|
466 |
-
|
467 |
-
|
468 |
-
|
469 |
-
|
470 |
-
|
471 |
-
|
472 |
-
|
473 |
-
|
474 |
-
|
475 |
-
|
476 |
-
|
477 |
-
|
478 |
-
|
479 |
-
|
480 |
-
|
481 |
-
|
482 |
-
|
483 |
-
|
484 |
-
|
485 |
-
|
486 |
-
|
487 |
-
|
488 |
-
|
489 |
-
|
490 |
-
|
491 |
-
|
492 |
-
|
493 |
-
|
494 |
-
|
495 |
-
|
496 |
-
|
497 |
-
|
498 |
-
|
499 |
-
|
500 |
-
|
501 |
-
|
502 |
-
|
503 |
-
|
504 |
-
|
505 |
-
|
506 |
-
|
507 |
-
|
508 |
-
|
509 |
-
|
510 |
-
|
511 |
-
|
512 |
-
|
513 |
-
|
514 |
-
|
515 |
-
|
516 |
-
|
517 |
-
|
518 |
-
|
519 |
-
|
520 |
-
|
521 |
-
|
522 |
-
|
523 |
-
|
524 |
-
|
525 |
-
|
526 |
-
|
527 |
-
|
528 |
-
|
529 |
-
|
530 |
-
|
531 |
-
|
532 |
-
|
533 |
-
|
534 |
-
|
535 |
-
|
536 |
-
|
537 |
-
|
538 |
-
|
539 |
-
|
540 |
-
|
541 |
-
|
542 |
-
|
543 |
-
|
544 |
-
|
545 |
-
|
546 |
-
|
547 |
-
|
548 |
-
|
549 |
-
|
550 |
-
|
551 |
-
|
552 |
-
|
553 |
-
|
554 |
-
|
555 |
-
|
556 |
-
|
557 |
-
|
558 |
-
|
559 |
-
|
560 |
-
|
561 |
-
|
562 |
-
|
563 |
-
|
564 |
-
|
565 |
-
|
566 |
-
|
567 |
-
|
568 |
-
|
569 |
-
|
570 |
-
|
571 |
-
|
572 |
-
|
573 |
-
|
574 |
-
|
575 |
-
|
576 |
-
|
577 |
-
|
578 |
-
|
579 |
-
|
580 |
-
|
581 |
-
|
582 |
-
|
583 |
-
|
584 |
-
|
585 |
-
|
586 |
-
|
587 |
-
|
588 |
-
|
589 |
-
|
590 |
-
|
591 |
-
|
592 |
-
|
593 |
-
|
594 |
-
|
595 |
-
|
596 |
-
|
597 |
-
|
598 |
-
|
599 |
-
|
600 |
-
|
601 |
-
|
602 |
-
|
603 |
-
}
|
604 |
-
|
605 |
-
|
606 |
-
|
607 |
-
|
608 |
-
|
609 |
-
|
610 |
-
|
611 |
-
|
612 |
-
|
613 |
-
|
614 |
-
|
615 |
-
|
616 |
-
|
617 |
-
|
618 |
-
|
619 |
-
|
620 |
-
|
621 |
-
|
622 |
-
|
623 |
-
|
624 |
-
|
625 |
-
|
626 |
-
|
627 |
-
|
628 |
-
|
629 |
-
|
630 |
-
|
631 |
-
|
632 |
-
|
633 |
-
|
634 |
-
|
635 |
-
|
636 |
-
|
637 |
-
|
638 |
-
|
639 |
-
|
640 |
-
|
641 |
-
|
642 |
-
|
643 |
-
|
644 |
-
|
645 |
-
|
646 |
-
|
647 |
-
|
648 |
-
|
649 |
-
|
650 |
-
|
651 |
-
|
652 |
-
|
653 |
-
|
654 |
-
|
655 |
-
|
656 |
-
|
657 |
-
|
658 |
-
|
659 |
-
|
660 |
-
|
661 |
-
|
662 |
-
|
663 |
-
|
664 |
-
|
665 |
-
|
666 |
-
|
667 |
-
|
668 |
-
|
669 |
-
|
670 |
-
|
671 |
-
|
672 |
-
|
673 |
-
|
674 |
-
|
675 |
-
|
676 |
-
|
677 |
-
|
678 |
-
|
679 |
-
|
680 |
-
|
681 |
-
|
682 |
-
|
683 |
-
|
684 |
-
|
685 |
-
|
686 |
-
|
687 |
-
|
688 |
-
|
689 |
-
|
690 |
-
|
691 |
-
|
692 |
-
|
693 |
-
|
694 |
-
|
695 |
-
|
696 |
-
|
697 |
-
|
698 |
-
|
699 |
-
|
700 |
-
|
701 |
-
|
702 |
-
|
703 |
-
|
704 |
-
|
705 |
-
|
706 |
-
|
707 |
-
|
708 |
-
|
709 |
-
|
710 |
-
|
711 |
-
|
712 |
-
|
713 |
-
|
714 |
-
|
715 |
-
|
716 |
-
|
717 |
-
|
718 |
-
|
719 |
-
|
720 |
-
|
721 |
-
|
722 |
-
|
723 |
-
|
724 |
-
|
725 |
-
|
726 |
-
|
727 |
-
|
728 |
-
|
729 |
-
|
730 |
-
|
731 |
-
|
732 |
-
|
733 |
-
|
734 |
-
|
735 |
-
|
736 |
-
|
737 |
-
|
738 |
-
|
739 |
-
|
740 |
-
|
741 |
-
|
742 |
-
|
743 |
-
|
744 |
-
|
745 |
-
|
746 |
-
|
747 |
-
|
748 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<?php
|
2 |
+
$scroll_offset = get_option ( 'eds_scroll_offset', '75' );
|
3 |
+
?>
|
4 |
+
<!doctype html>
|
5 |
+
<html lang="en">
|
6 |
+
<head>
|
7 |
+
<meta charset="utf-8">
|
8 |
+
<title><?php _e( 'Select your Animation Style', 'eds-animate' ); ?>:</title>
|
9 |
+
<meta name="viewport"
|
10 |
+
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
11 |
+
<link rel="stylesheet"
|
12 |
+
href="<?php echo plugin_dir_url(__FILE__).'../css/animate-animo.css'; ?>" />
|
13 |
+
<link rel="stylesheet"
|
14 |
+
href="<?php echo plugin_dir_url(__FILE__).'../css/style.css'; ?>" />
|
15 |
+
</head>
|
16 |
+
<body
|
17 |
+
onload="document.body.style.display='';"
|
18 |
+
dir="ltr">
|
19 |
+
<div class="modal edsai-wrapper">
|
20 |
+
<div class="edaai-body">
|
21 |
+
<div class="preview-badge">
|
22 |
+
<span id="animationSandbox">
|
23 |
+
<h1 class="site__title mega animateit-icon"></h1>
|
24 |
+
</span>
|
25 |
+
</div>
|
26 |
+
<form name="edsanimate_form" id="edsanimate_form">
|
27 |
+
<div class="edsai-form-wrapper">
|
28 |
+
<div class="edsai-tabs">
|
29 |
+
<div class="edsai-tab edsai-tab-active">
|
30 |
+
<a class="edsai-tab-handler" href="#tab-entry"><?php _e( 'Entry', 'eds-animate' ); ?></a>
|
31 |
+
</div>
|
32 |
+
<div class="edsai-tab">
|
33 |
+
<a class="edsai-tab-handler" href="#tab-exit"><?php _e( 'Exit', 'eds-animate' ); ?></a>
|
34 |
+
</div>
|
35 |
+
<div class="edsai-tab">
|
36 |
+
<a class="edsai-tab-handler" href="#tab-options"><?php _e( 'Options', 'eds-animate' ); ?></a>
|
37 |
+
</div>
|
38 |
+
</div>
|
39 |
+
<div id="tab-entry" class="edsai-tab-content edsai-entry"
|
40 |
+
style="display: block;">
|
41 |
+
<div class="edsai-form-control-wrapper">
|
42 |
+
<label for="entry-animation-type"><?php _e( 'Animation', 'eds-animate' ); ?>:</label>
|
43 |
+
<div class="edsai-form-control">
|
44 |
+
<select id="entry-animation-type" name="entry-animation-type"
|
45 |
+
class="full-size">
|
46 |
+
<option value="none"><?php _e( 'None', 'eds-animate' ); ?></option>
|
47 |
+
<optgroup label="Bouncing Entrances">
|
48 |
+
<option value="bounceIn">bounceIn</option>
|
49 |
+
<option value="bounceInDown">bounceInDown</option>
|
50 |
+
<option value="bounceInLeft">bounceInLeft</option>
|
51 |
+
<option value="bounceInRight">bounceInRight</option>
|
52 |
+
<option value="bounceInUp">bounceInUp</option>
|
53 |
+
</optgroup>
|
54 |
+
<optgroup label="Fading Entrances">
|
55 |
+
<option value="fadeIn" selected>fadeIn</option>
|
56 |
+
<option value="fadeInDown">fadeInDown</option>
|
57 |
+
<option value="fadeInDownBig">fadeInDownBig</option>
|
58 |
+
<option value="fadeInLeft">fadeInLeft</option>
|
59 |
+
<option value="fadeInLeftBig">fadeInLeftBig</option>
|
60 |
+
<option value="fadeInRight">fadeInRight</option>
|
61 |
+
<option value="fadeInRightBig">fadeInRightBig</option>
|
62 |
+
<option value="fadeInUp">fadeInUp</option>
|
63 |
+
<option value="fadeInUpBig">fadeInUpBig</option>
|
64 |
+
</optgroup>
|
65 |
+
<optgroup label="Rotating Entrances">
|
66 |
+
<option value="rotateIn">rotateIn</option>
|
67 |
+
<option value="rotateInDownLeft">rotateInDownLeft</option>
|
68 |
+
<option value="rotateInDownRight">rotateInDownRight</option>
|
69 |
+
<option value="rotateInUpLeft">rotateInUpLeft</option>
|
70 |
+
<option value="rotateInUpRight">rotateInUpRight</option>
|
71 |
+
</optgroup>
|
72 |
+
<optgroup label="Sliding Entrances">
|
73 |
+
<option value="slideInUp">slideInUp</option>
|
74 |
+
<option value="slideInDown">slideInDown</option>
|
75 |
+
<option value="slideInLeft">slideInLeft</option>
|
76 |
+
<option value="slideInRight">slideInRight</option>
|
77 |
+
</optgroup>
|
78 |
+
<optgroup label="Zoom Entrances">
|
79 |
+
<option value="zoomIn">zoomIn</option>
|
80 |
+
<option value="zoomInDown">zoomInDown</option>
|
81 |
+
<option value="zoomInLeft">zoomInLeft</option>
|
82 |
+
<option value="zoomInRight">zoomInRight</option>
|
83 |
+
<option value="zoomInUp">zoomInUp</option>
|
84 |
+
</optgroup>
|
85 |
+
<optgroup label="Attention Seekers">
|
86 |
+
<option value="spinner">Spin</option>
|
87 |
+
<option value="bounce">bounce</option>
|
88 |
+
<option value="flash">flash</option>
|
89 |
+
<option value="rubberBand">rubberBand</option>
|
90 |
+
<option value="shake">shake</option>
|
91 |
+
<option value="swing">swing</option>
|
92 |
+
<option value="tada">tada</option>
|
93 |
+
<option value="wobble">wobble</option>
|
94 |
+
<option value="jello">jello</option>
|
95 |
+
<option value="wiggle">wiggle</option>
|
96 |
+
<option value="fade">fade</option>
|
97 |
+
<option value="appear">appear</option>
|
98 |
+
<option value="grow">grow</option>
|
99 |
+
<option value="shrink">shrink</option>
|
100 |
+
<option value="push">push</option>
|
101 |
+
<option value="pop">pop</option>
|
102 |
+
<option value="float">float</option>
|
103 |
+
<option value="sink">sink</option>
|
104 |
+
<option value="forward">forward</option>
|
105 |
+
<option value="backward">backward</option>
|
106 |
+
</optgroup>
|
107 |
+
<optgroup label="Pulse">
|
108 |
+
<option value="pulse">pulse</option>
|
109 |
+
<option value="pulseGrow">pulseGrow</option>
|
110 |
+
<option value="pulseShrink">pulseShrink</option>
|
111 |
+
</optgroup>
|
112 |
+
<optgroup label="Rotate">
|
113 |
+
<option value="rotate">rotate</option>
|
114 |
+
<option value="growRotate">growRotate</option>
|
115 |
+
</optgroup>
|
116 |
+
<optgroup label="Skew">
|
117 |
+
<option value="skew">skew</option>
|
118 |
+
<option value="skewForward">skewForward</option>
|
119 |
+
<option value="skewBackward">skewBackward</option>
|
120 |
+
</optgroup>
|
121 |
+
<optgroup label="Wobble">
|
122 |
+
<option value="wobbleHorizontal">wobbleHorizontal</option>
|
123 |
+
<option value="wobbleVertical">wobbleVertical</option>
|
124 |
+
<option value="wobbleToBottomRight">wobbleToBottomRight</option>
|
125 |
+
<option value="wobbleToTopRight">wobbleToTopRight</option>
|
126 |
+
<option value="wobbleTop">wobbleTop</option>
|
127 |
+
<option value="wobbleBottom">wobbleBottom</option>
|
128 |
+
<option value="wobbleSkew">wobbleSkew</option>
|
129 |
+
</optgroup>
|
130 |
+
<optgroup label="Buzz">
|
131 |
+
<option value="buzz">buzz</option>
|
132 |
+
<option value="buzzOut">buzzOut</option>
|
133 |
+
</optgroup>
|
134 |
+
<optgroup label="Flippers">
|
135 |
+
<option value="flip">flip</option>
|
136 |
+
<option value="flipInX">flipInX</option>
|
137 |
+
<option value="flipInY">flipInY</option>
|
138 |
+
</optgroup>
|
139 |
+
<optgroup label="Lightspeed">
|
140 |
+
<option value="lightSpeedIn">lightSpeedIn</option>
|
141 |
+
</optgroup>
|
142 |
+
<optgroup label="Twirl">
|
143 |
+
<option value="twirlIn">twirlIn</option>
|
144 |
+
</optgroup>
|
145 |
+
<optgroup label="Specials">
|
146 |
+
<option value="hinge">hinge</option>
|
147 |
+
<option value="rollIn">rollIn</option>
|
148 |
+
</optgroup>
|
149 |
+
</select>
|
150 |
+
</div>
|
151 |
+
</div>
|
152 |
+
<div class="edsai-form-control-wrapper">
|
153 |
+
<label for="entry-delay"><?php _e( 'Delay (in seconds)', 'eds-animate' ); ?>:</label>
|
154 |
+
<div class="edsai-form-control">
|
155 |
+
<select id="entry-delay" name="entry-delay"
|
156 |
+
class="half-size has-custom">
|
157 |
+
<option value="0"><?php _e( 'None', 'eds-animate' ); ?></option>
|
158 |
+
<option value="0.5">0.5</option>
|
159 |
+
<option value="1">1.0</option>
|
160 |
+
<option value="1.5">1.5</option>
|
161 |
+
<option value="2">2.0</option>
|
162 |
+
<option value="2.5">2.5</option>
|
163 |
+
<option value="3">3.0</option>
|
164 |
+
<option value="3.5">3.5</option>
|
165 |
+
<option value="4">4.0</option>
|
166 |
+
<option value="4.5">4.5</option>
|
167 |
+
<option value="5">5.0</option>
|
168 |
+
<option value="5.5">5.5</option>
|
169 |
+
<option value="6">6.0</option>
|
170 |
+
<option value="custom"><?php _e( 'Custom', 'eds-animate' ); ?></option>
|
171 |
+
</select> <input id="entry-delay-custom"
|
172 |
+
name="entry-delay-custom" class="half-size custom-field"
|
173 |
+
placeholder="Custom Delay e.g. 2.7" />
|
174 |
+
</div>
|
175 |
+
</div>
|
176 |
+
<div class="edsai-form-control-wrapper">
|
177 |
+
<label for="entry-duration"><?php _e( 'Duration (in seconds)', 'eds-animate' ); ?>:</label>
|
178 |
+
<div class="edsai-form-control">
|
179 |
+
<select id="entry-duration" name="entry-duration"
|
180 |
+
class="half-size has-custom">
|
181 |
+
<option value="0.5">0.5</option>
|
182 |
+
<option value="1">1.0</option>
|
183 |
+
<option value="1.5">1.5</option>
|
184 |
+
<option value="2">2.0</option>
|
185 |
+
<option value="2.5">2.5</option>
|
186 |
+
<option value="3">3.0</option>
|
187 |
+
<option value="3.5">3.5</option>
|
188 |
+
<option value="4">4.0</option>
|
189 |
+
<option value="4.5">4.5</option>
|
190 |
+
<option value="5">5.0</option>
|
191 |
+
<option value="5.5">5.5</option>
|
192 |
+
<option value="6">6.0</option>
|
193 |
+
<option value="custom"><?php _e( 'Custom', 'eds-animate' ); ?></option>
|
194 |
+
</select> <input id="entry-duration-custom"
|
195 |
+
name="entry-duration-custom" class="half-size custom-field"
|
196 |
+
placeholder="Custom Duration e.g. 3.2" />
|
197 |
+
</div>
|
198 |
+
</div>
|
199 |
+
<div class="edsai-form-control-wrapper">
|
200 |
+
<label for="entry-timing"><?php _e( 'Timing', 'eds-animate' ); ?>:</label>
|
201 |
+
<div class="edsai-form-control">
|
202 |
+
<select id="entry-timing" name="entry-timing"
|
203 |
+
class="half-size">
|
204 |
+
<option value="linear">linear</option>
|
205 |
+
<option value="ease">ease</option>
|
206 |
+
<option value="ease-in">easeIn</option>
|
207 |
+
<option value="ease-out">easeOut</option>
|
208 |
+
<option value="ease-in-out">easeInOut</option>
|
209 |
+
<option value="cubic-bezier(0.47, 0, 0.745, 0.715)">easeInSine</option>
|
210 |
+
<option value="cubic-bezier(0.39, 0.575, 0.565, 1)">easeOutSine</option>
|
211 |
+
<option value="cubic-bezier(0.445, 0.05, 0.55, 0.95)">easeInOutSine</option>
|
212 |
+
<option value="cubic-bezier(0.55, 0.085, 0.68, 0.53)">easeInQuad</option>
|
213 |
+
<option value="cubic-bezier(0.25, 0.46, 0.45, 0.94)">easeOutQuad</option>
|
214 |
+
<option value="cubic-bezier(0.455, 0.03, 0.515, 0.955)">easeInOutQuad</option>
|
215 |
+
<option value="cubic-bezier(0.55, 0.055, 0.675, 0.19)">easeInCubic</option>
|
216 |
+
<option value="cubic-bezier(0.215, 0.61, 0.355, 1)">easeOutCubic</option>
|
217 |
+
<option value="cubic-bezier(0.645, 0.045, 0.355, 1)">easeInOutCubic</option>
|
218 |
+
<option value="cubic-bezier(0.895, 0.03, 0.685, 0.22)">easeInQuart</option>
|
219 |
+
<option value="cubic-bezier(0.165, 0.84, 0.44, 1)">easeOutQuart</option>
|
220 |
+
<option value="cubic-bezier(0.77, 0, 0.175, 1)">easeInOutQuart</option>
|
221 |
+
<option value="cubic-bezier(0.755, 0.05, 0.855, 0.06)">easeInQuint</option>
|
222 |
+
<option value="cubic-bezier(0.23, 1, 0.32, 1)">easeOutQuint</option>
|
223 |
+
<option value="cubic-bezier(0.86, 0, 0.07, 1)">easeInOutQuint</option>
|
224 |
+
<option value="cubic-bezier(0.95, 0.05, 0.795, 0.035)">easeInExpo</option>
|
225 |
+
<option value="cubic-bezier(0.19, 1, 0.22, 1)">easeOutExpo</option>
|
226 |
+
<option value="cubic-bezier(1, 0, 0, 1)">easeInOutExpo</option>
|
227 |
+
<option value="cubic-bezier(0.6, 0.04, 0.98, 0.335)">easeInCirc</option>
|
228 |
+
<option value="cubic-bezier(0.075, 0.82, 0.165, 1)">easeOutCirc</option>
|
229 |
+
<option value="cubic-bezier(0.785, 0.135, 0.15, 0.86)">easeInOutCirc</option>
|
230 |
+
<option value="cubic-bezier(0.6, -0.28, 0.735, 0.045)">easeInBack</option>
|
231 |
+
<option value="cubic-bezier(0.175, 0.885, 0.32, 1.275)">easeOutBack</option>
|
232 |
+
<option value="cubic-bezier(0.68, -0.55, 0.265, 1.55)">easeInOutBack</option>
|
233 |
+
</select>
|
234 |
+
</div>
|
235 |
+
</div>
|
236 |
+
</div>
|
237 |
+
<div id="tab-exit" class="edsai-tab-content edsai-exit">
|
238 |
+
<div class="edsai-form-control-wrapper">
|
239 |
+
<label for="exit-animation-type"><?php _e( 'Animation', 'eds-animate' ); ?>:</label>
|
240 |
+
<div class="edsai-form-control">
|
241 |
+
<select id="exit-animation-type" name="exit-animation-type"
|
242 |
+
class="full-size">
|
243 |
+
<option value="none"><?php _e( 'None', 'eds-animate' ); ?></option>
|
244 |
+
<optgroup label="Bouncing Exits">
|
245 |
+
<option value="bounceOut">bounceOut</option>
|
246 |
+
<option value="bounceOutDown">bounceOutDown</option>
|
247 |
+
<option value="bounceOutLeft">bounceOutLeft</option>
|
248 |
+
<option value="bounceOutRight">bounceOutRight</option>
|
249 |
+
<option value="bounceOutUp">bounceOutUp</option>
|
250 |
+
</optgroup>
|
251 |
+
<optgroup label="Fading Exits">
|
252 |
+
<option value="fadeOut">fadeOut</option>
|
253 |
+
<option value="fadeOutDown">fadeOutDown</option>
|
254 |
+
<option value="fadeOutDownBig">fadeOutDownBig</option>
|
255 |
+
<option value="fadeOutLeft">fadeOutLeft</option>
|
256 |
+
<option value="fadeOutLeftBig">fadeOutLeftBig</option>
|
257 |
+
<option value="fadeOutRight">fadeOutRight</option>
|
258 |
+
<option value="fadeOutRightBig">fadeOutRightBig</option>
|
259 |
+
<option value="fadeOutUp">fadeOutUp</option>
|
260 |
+
<option value="fadeOutUpBig">fadeOutUpBig</option>
|
261 |
+
</optgroup>
|
262 |
+
<optgroup label="Rotating Exits">
|
263 |
+
<option value="rotateOut">rotateOut</option>
|
264 |
+
<option value="rotateOutDownLeft">rotateOutDownLeft</option>
|
265 |
+
<option value="rotateOutDownRight">rotateOutDownRight</option>
|
266 |
+
<option value="rotateOutUpLeft">rotateOutUpLeft</option>
|
267 |
+
<option value="rotateOutUpRight">rotateOutUpRight</option>
|
268 |
+
</optgroup>
|
269 |
+
<optgroup label="Sliding Exits">
|
270 |
+
<option value="slideOutUp">slideOutUp</option>
|
271 |
+
<option value="slideOutDown">slideOutDown</option>
|
272 |
+
<option value="slideOutLeft">slideOutLeft</option>
|
273 |
+
<option value="slideOutRight">slideOutRight</option>
|
274 |
+
</optgroup>
|
275 |
+
<optgroup label="Zoom Exits">
|
276 |
+
<option value="zoomOut">zoomOut</option>
|
277 |
+
<option value="zoomOutDown">zoomOutDown</option>
|
278 |
+
<option value="zoomOutLeft">zoomOutLeft</option>
|
279 |
+
<option value="zoomOutRight">zoomOutRight</option>
|
280 |
+
<option value="zoomOutUp">zoomOutUp</option>
|
281 |
+
</optgroup>
|
282 |
+
<optgroup label="Attention Seekers">
|
283 |
+
<option value="spinner">Spin</option>
|
284 |
+
<option value="bounce">bounce</option>
|
285 |
+
<option value="flash">flash</option>
|
286 |
+
<option value="rubberBand">rubberBand</option>
|
287 |
+
<option value="shake">shake</option>
|
288 |
+
<option value="swing">swing</option>
|
289 |
+
<option value="tada">tada</option>
|
290 |
+
<option value="wobble">wobble</option>
|
291 |
+
<option value="jello">jello</option>
|
292 |
+
<option value="wiggle">wiggle</option>
|
293 |
+
<option value="fade">fade</option>
|
294 |
+
<option value="appear">appear</option>
|
295 |
+
<option value="grow">grow</option>
|
296 |
+
<option value="shrink">shrink</option>
|
297 |
+
<option value="push">push</option>
|
298 |
+
<option value="pop">pop</option>
|
299 |
+
<option value="float">float</option>
|
300 |
+
<option value="sink">sink</option>
|
301 |
+
<option value="forward">forward</option>
|
302 |
+
<option value="backward">backward</option>
|
303 |
+
</optgroup>
|
304 |
+
<optgroup label="Pulse">
|
305 |
+
<option value="pulse">pulse</option>
|
306 |
+
<option value="pulseGrow">pulseGrow</option>
|
307 |
+
<option value="pulseShrink">pulseShrink</option>
|
308 |
+
</optgroup>
|
309 |
+
<optgroup label="Rotate">
|
310 |
+
<option value="rotate">rotate</option>
|
311 |
+
<option value="growRotate">growRotate</option>
|
312 |
+
</optgroup>
|
313 |
+
<optgroup label="Skew">
|
314 |
+
<option value="skew">skew</option>
|
315 |
+
<option value="skewForward">skewForward</option>
|
316 |
+
<option value="skewBackward">skewBackward</option>
|
317 |
+
</optgroup>
|
318 |
+
<optgroup label="Wobble">
|
319 |
+
<option value="wobbleHorizontal">wobbleHorizontal</option>
|
320 |
+
<option value="wobbleVertical">wobbleVertical</option>
|
321 |
+
<option value="wobbleToBottomRight">wobbleToBottomRight</option>
|
322 |
+
<option value="wobbleToTopRight">wobbleToTopRight</option>
|
323 |
+
<option value="wobbleTop">wobbleTop</option>
|
324 |
+
<option value="wobbleBottom">wobbleBottom</option>
|
325 |
+
<option value="wobbleSkew">wobbleSkew</option>
|
326 |
+
</optgroup>
|
327 |
+
<optgroup label="Buzz">
|
328 |
+
<option value="buzz">buzz</option>
|
329 |
+
<option value="buzzOut">buzzOut</option>
|
330 |
+
</optgroup>
|
331 |
+
<optgroup label="Flippers">
|
332 |
+
<option value="flip">flip</option>
|
333 |
+
<option value="flipOutX">flipOutX</option>
|
334 |
+
<option value="flipOutY">flipOutY</option>
|
335 |
+
</optgroup>
|
336 |
+
<optgroup label="Lightspeed">
|
337 |
+
<option value="lightSpeedOut">lightSpeedOut</option>
|
338 |
+
</optgroup>
|
339 |
+
<optgroup label="Twirl">
|
340 |
+
<option value="twirlOut">twirlOut</option>
|
341 |
+
</optgroup>
|
342 |
+
<optgroup label="Specials">
|
343 |
+
<option value="hinge">hinge</option>
|
344 |
+
<option value="rollOut">rollOut</option>
|
345 |
+
</optgroup>
|
346 |
+
</select>
|
347 |
+
</div>
|
348 |
+
</div>
|
349 |
+
<div class="edsai-form-control-wrapper">
|
350 |
+
<label for="exit-delay"><?php _e( 'Delay (in seconds)', 'eds-animate' ); ?>:</label>
|
351 |
+
<div class="edsai-form-control">
|
352 |
+
<select id="exit-delay" name="exit-delay"
|
353 |
+
class="half-size has-custom">
|
354 |
+
<option value="0"><?php _e( 'None', 'eds-animate' ); ?></option>
|
355 |
+
<option value="0.5">0.5</option>
|
356 |
+
<option value="1">1.0</option>
|
357 |
+
<option value="1.5">1.5</option>
|
358 |
+
<option value="2">2.0</option>
|
359 |
+
<option value="2.5">2.5</option>
|
360 |
+
<option value="3">3.0</option>
|
361 |
+
<option value="3.5">3.5</option>
|
362 |
+
<option value="4">4.0</option>
|
363 |
+
<option value="4.5">4.5</option>
|
364 |
+
<option value="5">5.0</option>
|
365 |
+
<option value="5.5">5.5</option>
|
366 |
+
<option value="6">6.0</option>
|
367 |
+
<option value="custom"><?php _e( 'Custom', 'eds-animate' ); ?></option>
|
368 |
+
</select> <input id="exit-delay-custom" name="exit-delay-custom"
|
369 |
+
class="half-size custom-field"
|
370 |
+
placeholder="Custom Delay e.g. 2.7" />
|
371 |
+
</div>
|
372 |
+
</div>
|
373 |
+
<div class="edsai-form-control-wrapper">
|
374 |
+
<label for="exit-duration"><?php _e( 'Duration (in seconds)', 'eds-animate' ); ?>:</label>
|
375 |
+
<div class="edsai-form-control">
|
376 |
+
<select id="exit-duration" name="exit-duration"
|
377 |
+
class="half-size has-custom">
|
378 |
+
<option value="0.5">0.5</option>
|
379 |
+
<option value="1">1.0</option>
|
380 |
+
<option value="1.5">1.5</option>
|
381 |
+
<option value="2">2.0</option>
|
382 |
+
<option value="2.5">2.5</option>
|
383 |
+
<option value="3">3.0</option>
|
384 |
+
<option value="3.5">3.5</option>
|
385 |
+
<option value="4">4.0</option>
|
386 |
+
<option value="4.5">4.5</option>
|
387 |
+
<option value="5">5.0</option>
|
388 |
+
<option value="5.5">5.5</option>
|
389 |
+
<option value="6">6.0</option>
|
390 |
+
<option value="custom"><?php _e( 'Custom', 'eds-animate' ); ?></option>
|
391 |
+
</select> <input id="exit-duration-custom"
|
392 |
+
name="exit-duration-custom" class="half-size custom-field"
|
393 |
+
placeholder="Custom Duration e.g. 3.2" />
|
394 |
+
</div>
|
395 |
+
</div>
|
396 |
+
<div class="edsai-form-control-wrapper">
|
397 |
+
<label for="exit-timing"><?php _e( 'Timing', 'eds-animate' ); ?>:</label>
|
398 |
+
<div class="edsai-form-control">
|
399 |
+
<select id="exit-timing" name="exit-timing"
|
400 |
+
class="half-size">
|
401 |
+
<option value="linear">linear</option>
|
402 |
+
<option value="ease">ease</option>
|
403 |
+
<option value="ease-in">easeIn</option>
|
404 |
+
<option value="ease-out">easeOut</option>
|
405 |
+
<option value="ease-in-out">easeInOut</option>
|
406 |
+
<option value="cubic-bezier(0.47, 0, 0.745, 0.715)">easeInSine</option>
|
407 |
+
<option value="cubic-bezier(0.39, 0.575, 0.565, 1)">easeOutSine</option>
|
408 |
+
<option value="cubic-bezier(0.445, 0.05, 0.55, 0.95)">easeInOutSine</option>
|
409 |
+
<option value="cubic-bezier(0.55, 0.085, 0.68, 0.53)">easeInQuad</option>
|
410 |
+
<option value="cubic-bezier(0.25, 0.46, 0.45, 0.94)">easeOutQuad</option>
|
411 |
+
<option value="cubic-bezier(0.455, 0.03, 0.515, 0.955)">easeInOutQuad</option>
|
412 |
+
<option value="cubic-bezier(0.55, 0.055, 0.675, 0.19)">easeInCubic</option>
|
413 |
+
<option value="cubic-bezier(0.215, 0.61, 0.355, 1)">easeOutCubic</option>
|
414 |
+
<option value="cubic-bezier(0.645, 0.045, 0.355, 1)">easeInOutCubic</option>
|
415 |
+
<option value="cubic-bezier(0.895, 0.03, 0.685, 0.22)">easeInQuart</option>
|
416 |
+
<option value="cubic-bezier(0.165, 0.84, 0.44, 1)">easeOutQuart</option>
|
417 |
+
<option value="cubic-bezier(0.77, 0, 0.175, 1)">easeInOutQuart</option>
|
418 |
+
<option value="cubic-bezier(0.755, 0.05, 0.855, 0.06)">easeInQuint</option>
|
419 |
+
<option value="cubic-bezier(0.23, 1, 0.32, 1)">easeOutQuint</option>
|
420 |
+
<option value="cubic-bezier(0.86, 0, 0.07, 1)">easeInOutQuint</option>
|
421 |
+
<option value="cubic-bezier(0.95, 0.05, 0.795, 0.035)">easeInExpo</option>
|
422 |
+
<option value="cubic-bezier(0.19, 1, 0.22, 1)">easeOutExpo</option>
|
423 |
+
<option value="cubic-bezier(1, 0, 0, 1)">easeInOutExpo</option>
|
424 |
+
<option value="cubic-bezier(0.6, 0.04, 0.98, 0.335)">easeInCirc</option>
|
425 |
+
<option value="cubic-bezier(0.075, 0.82, 0.165, 1)">easeOutCirc</option>
|
426 |
+
<option value="cubic-bezier(0.785, 0.135, 0.15, 0.86)">easeInOutCirc</option>
|
427 |
+
<option value="cubic-bezier(0.6, -0.28, 0.735, 0.045)">easeInBack</option>
|
428 |
+
<option value="cubic-bezier(0.175, 0.885, 0.32, 1.275)">easeOutBack</option>
|
429 |
+
<option value="cubic-bezier(0.68, -0.55, 0.265, 1.55)">easeInOutBack</option>
|
430 |
+
</select>
|
431 |
+
</div>
|
432 |
+
</div>
|
433 |
+
</div>
|
434 |
+
<div id="tab-options" class="edsai-tab-content edsai-options">
|
435 |
+
<div class="edsai-form-control-wrapper">
|
436 |
+
<label for="options-animation-repeat"><?php _e( 'Animation Repeat', 'eds-animate' ); ?>:</label>
|
437 |
+
<div class="edsai-form-control">
|
438 |
+
<select id="options-animation-repeat"
|
439 |
+
name="options-animation-repeat" class="half-size has-custom">
|
440 |
+
<option value="1"><?php _e( 'Once', 'eds-animate' ); ?></option>
|
441 |
+
<option value="2"><?php _e( 'Twice', 'eds-animate' ); ?></option>
|
442 |
+
<option value="3"><?php _e( 'Thrice', 'eds-animate' ); ?></option>
|
443 |
+
<option value="infinite"><?php _e( 'Infinite', 'eds-animate' ); ?></option>
|
444 |
+
<option value="custom"><?php _e( 'Custom', 'eds-animate' ); ?></option>
|
445 |
+
</select> <input id="options-animation-repeat-custom"
|
446 |
+
name="options-animation-repeat-custom"
|
447 |
+
class="half-size custom-field" placeholder="e.g. 4" />
|
448 |
+
</div>
|
449 |
+
</div>
|
450 |
+
<div class="edsai-form-control-wrapper">
|
451 |
+
<label for="options-keep"><?php _e( 'Keep Element Final State', 'eds-animate' ); ?>:</label>
|
452 |
+
<div class="edsai-form-control">
|
453 |
+
<input id="keep-yes" type="radio" name="options-keep"
|
454 |
+
value="yes" checked> <label for="keep-yes"><?php _e( 'Yes', 'eds-animate' ); ?></label> <input
|
455 |
+
id="keep-no" type="radio" name="options-keep" value="no"> <label
|
456 |
+
for="keep-no"><?php _e( 'No', 'eds-animate' ); ?></label>
|
457 |
+
</div>
|
458 |
+
</div>
|
459 |
+
<div class="edsai-form-control-wrapper">
|
460 |
+
<label for="options-custom-css-class"><?php _e( 'Custom CSS Class', 'eds-animate' ); ?>:</label>
|
461 |
+
<div class="edsai-form-control">
|
462 |
+
<input id="options-custom-css-class"
|
463 |
+
name="options-custom-css-class" class="half-size"
|
464 |
+
placeholder="" value="" />
|
465 |
+
</div>
|
466 |
+
</div>
|
467 |
+
<div class="edsai-form-control-wrapper">
|
468 |
+
<label for="options-animate-on"><?php _e( 'Animate On', 'eds-animate' ); ?>:</label>
|
469 |
+
<div class="edsai-form-control">
|
470 |
+
<input type="radio" id="on-load" name="options-animate-on"
|
471 |
+
value="load" checked> <label for="on-load"><?php _e( 'Load', 'eds-animate' ); ?></label> <input
|
472 |
+
type="radio" id="on-click" name="options-animate-on"
|
473 |
+
value="click"> <label for="on-click"><?php _e( 'Click', 'eds-animate' ); ?></label> <input
|
474 |
+
type="radio" id="on-hover" name="options-animate-on"
|
475 |
+
value="hover"> <label for="on-hover"><?php _e( 'Hover', 'eds-animate' ); ?></label> <input
|
476 |
+
type="radio" id="on-scroll" name="options-animate-on"
|
477 |
+
value="scroll"> <label for="on-scroll"><?php _e( 'Scroll', 'eds-animate' ); ?></label>
|
478 |
+
</div>
|
479 |
+
</div>
|
480 |
+
<div
|
481 |
+
class="edsai-form-control-wrapper options-scroll-settings-wrapper">
|
482 |
+
<label for="options-scroll-offset"><?php _e( 'Scroll Offset (in %)', 'eds-animate' ); ?>:</label>
|
483 |
+
<div class="edsai-form-control">
|
484 |
+
<input id="options-scroll-offset" name="options-scroll-offset"
|
485 |
+
class="half-size" placeholder="Custom Offset % e.g. 20.7"
|
486 |
+
value="<?php echo $scroll_offset; ?>" />
|
487 |
+
</div>
|
488 |
+
</div>
|
489 |
+
</div>
|
490 |
+
</div>
|
491 |
+
<div class="edsai-footer-wrapper">
|
492 |
+
<div class="edsai-footer">
|
493 |
+
<div class="edsai-footer-left">
|
494 |
+
<?php _e( 'Powered by', 'eds-animate' ); ?> <a href="http://www.eleopard.in" target="_blank">eLEOPARD</a>
|
495 |
+
| <a
|
496 |
+
href="https://wordpress.org/support/view/plugin-reviews/animate-it"
|
497 |
+
target="_blank"><?php _e( 'Review Plugin', 'eds-animate' ); ?></a>
|
498 |
+
| <a
|
499 |
+
href="http://www.downloads.eleopard.in/animate-it-documentation-wordpress"
|
500 |
+
target="_blank"><?php _e( 'Documentation', 'eds-animate' ); ?></a>
|
501 |
+
</div>
|
502 |
+
<div class="edsai-footer-right">
|
503 |
+
<button type="button" class="btn-stop-infinite-animation"
|
504 |
+
style="display: none;"><?php _e( 'Stop Animation', 'eds-animate' ); ?></button>
|
505 |
+
<button type="button" class="edsai-animate-it btn-animate-it"><?php _e( 'Animate It!', 'eds-animate' ); ?></button>
|
506 |
+
<button type="button" class="edsai-insert btn-insert"><?php _e( 'Insert', 'eds-animate' ); ?></button>
|
507 |
+
</div>
|
508 |
+
</div>
|
509 |
+
</div>
|
510 |
+
</form>
|
511 |
+
</div>
|
512 |
+
</div>
|
513 |
+
<script type="text/javascript">
|
514 |
+
var args = top.tinymce.activeEditor.windowManager.getParams();
|
515 |
+
var parentEditor = args['editor'];
|
516 |
+
var url = args['plugin_url'];
|
517 |
+
var jQuery = args['jquery'];
|
518 |
+
</script>
|
519 |
+
<script type="text/javascript"
|
520 |
+
src="<?php echo plugin_dir_url(__FILE__).'../js/animo.min.js'; ?>"></script>
|
521 |
+
<script type="text/javascript">
|
522 |
+
( function( $ ) {
|
523 |
+
|
524 |
+
$.ready( function() {
|
525 |
+
|
526 |
+
var animate_infinite = false;
|
527 |
+
var total_repeat_count = 1;
|
528 |
+
var element_animating = false;
|
529 |
+
|
530 |
+
$.find('.custom-field').hide();
|
531 |
+
$.find('.options-scroll-settings-wrapper').hide();
|
532 |
+
|
533 |
+
$.find('.edsai-tab-handler').on( 'click', function( event ) {
|
534 |
+
|
535 |
+
event.preventDefault();
|
536 |
+
|
537 |
+
var btn = $.find( this );
|
538 |
+
|
539 |
+
$.find('.edsai-tab-content').css('display','none');
|
540 |
+
$.find('.edsai-tab').removeClass('edsai-tab-active');
|
541 |
+
|
542 |
+
btn.parent().addClass('edsai-tab-active');
|
543 |
+
$.find( btn.attr('href') ).css('display','block');
|
544 |
+
|
545 |
+
} );
|
546 |
+
|
547 |
+
$.find('.has-custom').on( 'change', function( event ) {
|
548 |
+
|
549 |
+
var select = $.find(this);
|
550 |
+
|
551 |
+
if( 'custom' == select.val() ) {
|
552 |
+
select.siblings('.custom-field').show();
|
553 |
+
} else {
|
554 |
+
select.siblings('.custom-field').hide();
|
555 |
+
}
|
556 |
+
|
557 |
+
} );
|
558 |
+
|
559 |
+
$.find('input[name="options-animate-on"]').on( 'change', function( event ) {
|
560 |
+
|
561 |
+
var value = $.find('input[name="options-animate-on"]:checked').val();
|
562 |
+
|
563 |
+
if( 'scroll' == value ) {
|
564 |
+
$.find('.options-scroll-settings-wrapper').show();
|
565 |
+
} else {
|
566 |
+
$.find('.options-scroll-settings-wrapper').hide()
|
567 |
+
$.find('input[name="options-scroll-offset"]').val('<?php echo $scroll_offset; ?>');
|
568 |
+
}
|
569 |
+
|
570 |
+
} );
|
571 |
+
|
572 |
+
$.find('#entry-animation-type').on( 'change', function( event ) {
|
573 |
+
var opt = $.find(this).val();
|
574 |
+
$.find('#exit-animation-type option').attr("disabled", false);
|
575 |
+
$.find('#exit-animation-type option[value="'+opt+'"]').attr("disabled", true);
|
576 |
+
|
577 |
+
} );
|
578 |
+
|
579 |
+
$.find('#exit-animation-type').on( 'change', function( event ) {
|
580 |
+
var opt = $.find(this).val();
|
581 |
+
$.find('#entry-animation-type option').attr("disabled", false);
|
582 |
+
$.find('#entry-animation-type option[value="'+opt+'"]').attr("disabled", true);
|
583 |
+
|
584 |
+
} );
|
585 |
+
|
586 |
+
|
587 |
+
function get_settings() {
|
588 |
+
|
589 |
+
var settings = {
|
590 |
+
'entry_animation_type': '',
|
591 |
+
'entry_delay': '',
|
592 |
+
'entry_duration': '',
|
593 |
+
'entry_timing': '',
|
594 |
+
'exit_animation_type': '',
|
595 |
+
'exit_delay': '',
|
596 |
+
'exit_duration': '',
|
597 |
+
'exit_timing': '',
|
598 |
+
'animation_repeat': '',
|
599 |
+
'keep':'',
|
600 |
+
'animate_on': '',
|
601 |
+
'scroll_offset': '',
|
602 |
+
'custom_css_class': ''
|
603 |
+
};
|
604 |
+
|
605 |
+
//reading entry animation settings
|
606 |
+
var entry_animation_type = $.find('#entry-animation-type').val();
|
607 |
+
if( 'none' != entry_animation_type ){
|
608 |
+
settings.entry_animation_type = entry_animation_type;
|
609 |
+
|
610 |
+
var entry_delay = $.find('#entry-delay').val();
|
611 |
+
if( 'custom' == entry_delay ) {
|
612 |
+
var entry_delay = $.find('#entry-delay-custom').val();
|
613 |
+
if( ! jQuery.isNumeric( entry_delay ) ) {
|
614 |
+
entry_delay = 0;
|
615 |
+
}
|
616 |
+
}
|
617 |
+
settings.entry_delay = entry_delay;
|
618 |
+
|
619 |
+
var entry_duration = $.find('#entry-duration').val();
|
620 |
+
if( 'custom' == entry_duration ) {
|
621 |
+
var entry_duration = $.find('#entry-duration-custom').val();
|
622 |
+
if( ! jQuery.isNumeric( entry_duration ) ) {
|
623 |
+
entry_duration = 0.5;
|
624 |
+
}
|
625 |
+
}
|
626 |
+
settings.entry_duration = entry_duration;
|
627 |
+
settings.entry_timing = $.find('#entry-timing').val();
|
628 |
+
}
|
629 |
+
|
630 |
+
//reading exit animation settings
|
631 |
+
var exit_animation_type = $.find('#exit-animation-type').val();
|
632 |
+
if( 'none' != exit_animation_type ){
|
633 |
+
|
634 |
+
settings.exit_animation_type = exit_animation_type;
|
635 |
+
|
636 |
+
var exit_delay = $.find('#exit-delay').val();
|
637 |
+
if( 'custom' == exit_delay ) {
|
638 |
+
var exit_delay = $.find('#exit-delay-custom').val();
|
639 |
+
if( ! jQuery.isNumeric( exit_delay ) ) {
|
640 |
+
exit_delay = 0;
|
641 |
+
}
|
642 |
+
}
|
643 |
+
settings.exit_delay = exit_delay;
|
644 |
+
|
645 |
+
var exit_duration = $.find('#exit-duration').val();
|
646 |
+
if( 'custom' == exit_duration ) {
|
647 |
+
var exit_duration = $.find('#exit-duration-custom').val();
|
648 |
+
|
649 |
+
if( ! jQuery.isNumeric( exit_duration ) ) {
|
650 |
+
exit_duration = 0.5;
|
651 |
+
}
|
652 |
+
}
|
653 |
+
settings.exit_duration = exit_duration;
|
654 |
+
settings.exit_timing = $.find('#exit-timing').val();
|
655 |
+
}
|
656 |
+
|
657 |
+
//reading other options
|
658 |
+
var animation_repeat = $.find('#options-animation-repeat').val();
|
659 |
+
if( 'custom' == animation_repeat ) {
|
660 |
+
var animation_repeat = $.find('#options-animation-repeat-custom').val();
|
661 |
+
if( ! jQuery.isNumeric( animation_repeat ) ) {
|
662 |
+
animation_repeat = 1;
|
663 |
+
}
|
664 |
+
}
|
665 |
+
settings.animation_repeat = animation_repeat;
|
666 |
+
|
667 |
+
var animate_on = $.find('input[name="options-animate-on"]:checked').val();
|
668 |
+
settings.animate_on = animate_on;
|
669 |
+
|
670 |
+
var scroll_offset = '';
|
671 |
+
if( 'scroll' == animate_on ) {
|
672 |
+
scroll_offset = $.find('#options-scroll-offset').val();
|
673 |
+
if( ! jQuery.isNumeric( scroll_offset ) ) {
|
674 |
+
scroll_offset = '<?php echo $scroll_offset; ?>';
|
675 |
+
}
|
676 |
+
}
|
677 |
+
settings.scroll_offset = scroll_offset;
|
678 |
+
settings.custom_css_class = $.find('#options-custom-css-class').val();
|
679 |
+
|
680 |
+
var keep_final_state = $.find('input[name="options-keep"]:checked').val();
|
681 |
+
if( "yes" == keep_final_state ) {
|
682 |
+
settings.keep = "yes";
|
683 |
+
} else {
|
684 |
+
settings.keep = "no";
|
685 |
+
}
|
686 |
+
|
687 |
+
return settings;
|
688 |
+
|
689 |
+
}
|
690 |
+
|
691 |
+
function reset_animation(){
|
692 |
+
element_animating = false;
|
693 |
+
animate_infinite = false;
|
694 |
+
total_repeat_count = 1;
|
695 |
+
$.find('.animateit-icon').animo("cleanse");
|
696 |
+
$.find('.btn-animate-it').show();
|
697 |
+
$.find('.btn-stop-infinite-animation').hide();
|
698 |
+
}
|
699 |
+
|
700 |
+
|
701 |
+
function eds_animate( animations, counter, iteration ) {
|
702 |
+
|
703 |
+
$.find('.animateit-icon').animo( animations[ counter ].animoSettings, function() {
|
704 |
+
counter++
|
705 |
+
if( counter < animations.length ) {
|
706 |
+
setTimeout( function(){ eds_animate( animations, counter, iteration ) }, Number(animations[counter].delay) * 1000);
|
707 |
+
} else {
|
708 |
+
iteration++;
|
709 |
+
if( true == animate_infinite || iteration < total_repeat_count) {
|
710 |
+
if(animations.length == 1) {
|
711 |
+
$.find('.animateit-icon').animo("cleanse");
|
712 |
+
}
|
713 |
+
setTimeout( function(){ eds_animate( animations, 0, iteration ) }, Number( animations[0].delay) * 1000);
|
714 |
+
} else {
|
715 |
+
reset_animation();
|
716 |
+
}
|
717 |
+
}
|
718 |
+
|
719 |
+
});
|
720 |
+
|
721 |
+
}
|
722 |
+
|
723 |
+
$.find('.btn-insert').on( 'click', function( event ) {
|
724 |
+
|
725 |
+
var settings = get_settings();
|
726 |
+
|
727 |
+
if( '' == settings.entry_animation_type
|
728 |
+
&& '' == settings.exit_animation_type ) {
|
729 |
+
alert("Please select animation first.");
|
730 |
+
return '';
|
731 |
+
}
|
732 |
+
|
733 |
+
|
734 |
+
var editorContent = parentEditor.selection.getContent();
|
735 |
+
|
736 |
+
if( null == editorContent || "" == editorContent ) {
|
737 |
+
editorContent = ' <p>Please add your content in this area.</p> ';
|
738 |
+
}
|
739 |
+
|
740 |
+
var short_code = [ '[edsanimate_start',
|
741 |
+
' entry_animation_type= "', settings.entry_animation_type, '"',
|
742 |
+
' entry_delay= "', settings.entry_delay, '"',
|
743 |
+
' entry_duration= "', settings.entry_duration, '"',
|
744 |
+
' entry_timing= "', settings.entry_timing, '"',
|
745 |
+
' exit_animation_type= "', settings.exit_animation_type, '"',
|
746 |
+
' exit_delay= "', settings.exit_delay, '"',
|
747 |
+
' exit_duration= "', settings.exit_duration, '"',
|
748 |
+
' exit_timing= "', settings.exit_timing, '"',
|
749 |
+
' animation_repeat= "', settings.animation_repeat, '"',
|
750 |
+
' keep= "', settings.keep, '"',
|
751 |
+
' animate_on= "', settings.animate_on, '"',
|
752 |
+
' scroll_offset= "', settings.scroll_offset, '"',
|
753 |
+
' custom_css_class= "', settings.custom_css_class, '"', ']',
|
754 |
+
editorContent,
|
755 |
+
'[edsanimate_end]' ]. join('');
|
756 |
+
|
757 |
+
parentEditor.execCommand('mceInsertContent', false, short_code);
|
758 |
+
|
759 |
+
parentEditor.windowManager.close();
|
760 |
+
|
761 |
+
} );
|
762 |
+
|
763 |
+
$.find('.btn-animate-it').on( 'click', function( event ) {
|
764 |
+
|
765 |
+
var animations = [];
|
766 |
+
|
767 |
+
var settings = get_settings();
|
768 |
+
|
769 |
+
var keep_value = false;
|
770 |
+
|
771 |
+
if("yes" == settings.keep ) {
|
772 |
+
keep_value = true;
|
773 |
+
}
|
774 |
+
|
775 |
+
if( '' != settings.entry_animation_type ) {
|
776 |
+
|
777 |
+
animations.push({
|
778 |
+
animoSettings: {
|
779 |
+
animation: settings.entry_animation_type,
|
780 |
+
duration: settings.entry_duration,
|
781 |
+
iterate: 1,
|
782 |
+
timing: settings.entry_timing,
|
783 |
+
keep: keep_value
|
784 |
+
},
|
785 |
+
delay: settings.entry_delay,
|
786 |
+
});
|
787 |
+
|
788 |
+
}
|
789 |
+
|
790 |
+
if( '' != settings.exit_animation_type ) {
|
791 |
+
animations.push({
|
792 |
+
animoSettings: {
|
793 |
+
animation: settings.exit_animation_type,
|
794 |
+
duration: settings.exit_duration,
|
795 |
+
iterate: 1,
|
796 |
+
timing: settings.exit_timing,
|
797 |
+
keep: keep_value
|
798 |
+
},
|
799 |
+
delay: settings.exit_delay
|
800 |
+
});
|
801 |
+
}
|
802 |
+
|
803 |
+
if( "infinite" == settings.animation_repeat ) {
|
804 |
+
animate_infinite = true;
|
805 |
+
} else {
|
806 |
+
animate_infinite = false;
|
807 |
+
total_repeat_count = settings.animation_repeat;
|
808 |
+
}
|
809 |
+
|
810 |
+
if( animations.length >= 1 ) {
|
811 |
+
$.find('.btn-animate-it').hide();
|
812 |
+
$.find('.btn-stop-infinite-animation').show();
|
813 |
+
setTimeout( function(){ eds_animate( animations, 0, 0 )}, Number( animations[0].delay ) * 1000);
|
814 |
+
}
|
815 |
+
|
816 |
+
} );
|
817 |
+
|
818 |
+
$.find('.btn-stop-infinite-animation').on( 'click', function( event ) {
|
819 |
+
reset_animation();
|
820 |
+
} );
|
821 |
+
|
822 |
+
} );
|
823 |
+
|
824 |
+
} )( jQuery( document ) );
|
825 |
+
|
826 |
+
</script>
|
827 |
+
</body>
|
828 |
+
</html>
|
assets/js/edsanimate.js
CHANGED
@@ -1,106 +1,106 @@
|
|
1 |
-
(function($) {
|
2 |
-
$(document).ready(function(){
|
3 |
-
var animationStyleClasses = ["animated","infinite", "bounce", "flash", "pulse", "rubberBand", "shake", "swing", "tada", "wobble", "bounceIn", "bounceInDown", "bounceInLeft", "bounceInRight", "bounceInUp", "bounceOut", "bounceOutDown", "bounceOutLeft", "bounceOutRight", "bounceOutUp", "fadeIn", "fadeInDown", "fadeInDownBig", "fadeInLeft", "fadeInLeftBig", "fadeInRight", "fadeInRightBig", "fadeInUp", "fadeInUpBig", "fadeOut", "fadeOutDown", "fadeOutDownBig", "fadeOutLeft", "fadeOutLeftBig", "fadeOutRight", "fadeOutRightBig", "fadeOutUp", "fadeOutUpBig", "flip", "flipInX", "flipInY", "flipOutX", "flipOutY", "lightSpeedIn", "lightSpeedOut", "rotateIn", "rotateInDownLeft", "rotateInDownRight", "rotateInUpLeft", "rotateInUpRight", "rotateOut", "rotateOutDownLeft", "rotateOutDownRight", "rotateOutUpLeft", "rotateOutUpRight", "hinge", "rollIn", "rollOut", "zoomIn", "zoomInDown", "zoomInLeft", "zoomInRight", "zoomInUp", "zoomOut", "zoomOutDown", "zoomOutLeft", "zoomOutRight", "zoomOutUp"];
|
4 |
-
var delayClasses = ["delay1", "delay2", "delay3", "delay4", "delay5", "delay6", "delay7", "delay8", "delay9", "delay10", "delay11", "delay12"];
|
5 |
-
var durationClasses = ["duration1", "duration2", "duration3", "duration4", "duration5", "duration6", "duration7", "duration8", "duration9", "duration10", "duration11", "duration12", "duration13", "duration14", "duration15", "duration16", "duration17", "duration18", "duration19", "duration20"];
|
6 |
-
var scrollOffset = edsanimate_options.offset;
|
7 |
-
|
8 |
-
$('.eds-animation-paused').removeClass('eds-animation-paused');
|
9 |
-
|
10 |
-
$('.eds-on-scroll').each(function(){
|
11 |
-
var $module = $(this);
|
12 |
-
|
13 |
-
var classesToAdd = " eds-scroll-visible ";
|
14 |
-
|
15 |
-
$module.removeClass(function(index, className){
|
16 |
-
var removeClassList = "";
|
17 |
-
var classList = className.trim().split(/\s+/);
|
18 |
-
$.each(classList, function(index, value){
|
19 |
-
if(($.inArray(value, animationStyleClasses)!==-1)
|
20 |
-
|| ($.inArray(value, delayClasses)!==-1)
|
21 |
-
|| ($.inArray(value, durationClasses)!==-1))
|
22 |
-
removeClassList += " " + value;
|
23 |
-
});
|
24 |
-
|
25 |
-
classesToAdd += removeClassList;
|
26 |
-
return removeClassList;
|
27 |
-
});
|
28 |
-
|
29 |
-
$module.addClass("eds-scroll-hidden");
|
30 |
-
|
31 |
-
$module.edsViewportChecker({
|
32 |
-
classToAdd: classesToAdd,
|
33 |
-
offset: scrollOffset
|
34 |
-
});
|
35 |
-
|
36 |
-
});
|
37 |
-
|
38 |
-
$('.eds-on-click').each(function(){
|
39 |
-
var $module = $(this);
|
40 |
-
|
41 |
-
var classesToAdd = " ";
|
42 |
-
|
43 |
-
$module.removeClass(function(index, className){
|
44 |
-
var removeClassList = "";
|
45 |
-
var classList = className.trim().split(/\s+/);
|
46 |
-
$.each(classList, function(index, value){
|
47 |
-
if(($.inArray(value, animationStyleClasses)!==-1)
|
48 |
-
|| ($.inArray(value, delayClasses)!==-1)
|
49 |
-
|| ($.inArray(value, durationClasses)!==-1))
|
50 |
-
removeClassList += " " + value;
|
51 |
-
});
|
52 |
-
|
53 |
-
classesToAdd += removeClassList;
|
54 |
-
return removeClassList;
|
55 |
-
});
|
56 |
-
|
57 |
-
$module.click(function (){
|
58 |
-
$(this).removeClass(classesToAdd).addClass(classesToAdd).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
|
59 |
-
$(this).removeClass(classesToAdd);
|
60 |
-
});
|
61 |
-
});
|
62 |
-
|
63 |
-
});
|
64 |
-
|
65 |
-
$('.eds-on-hover').each(function(){
|
66 |
-
var $module = $(this);
|
67 |
-
|
68 |
-
var classesToAdd = " ";
|
69 |
-
|
70 |
-
$module.removeClass(function(index, className){
|
71 |
-
var removeClassList = "";
|
72 |
-
var classList = className.trim().split(/\s+/);
|
73 |
-
$.each(classList, function(index, value){
|
74 |
-
if(($.inArray(value, animationStyleClasses)!==-1)
|
75 |
-
|| ($.inArray(value, delayClasses)!==-1)
|
76 |
-
|| ($.inArray(value, durationClasses)!==-1))
|
77 |
-
removeClassList += " " + value;
|
78 |
-
});
|
79 |
-
|
80 |
-
classesToAdd += removeClassList;
|
81 |
-
return removeClassList;
|
82 |
-
});
|
83 |
-
|
84 |
-
var hovered = false;
|
85 |
-
$module.hover(
|
86 |
-
function (){
|
87 |
-
hovered = true;
|
88 |
-
$(this).removeClass(classesToAdd).addClass(classesToAdd).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
|
89 |
-
$(this).removeClass(classesToAdd);
|
90 |
-
});
|
91 |
-
},
|
92 |
-
function (){
|
93 |
-
hovered = false;
|
94 |
-
$(this).on('webkitAnimationIteration oanimationiteration msAnimationiteration animationiteration', function(e){
|
95 |
-
if(!hovered){
|
96 |
-
$(this).removeClass(classesToAdd);
|
97 |
-
}
|
98 |
-
});
|
99 |
-
}
|
100 |
-
);
|
101 |
-
|
102 |
-
});
|
103 |
-
|
104 |
-
|
105 |
-
});
|
106 |
})(jQuery);
|
1 |
+
(function($) {
|
2 |
+
$(document).ready(function(){
|
3 |
+
var animationStyleClasses = ["animated","infinite", "bounce", "flash", "pulse", "rubberBand", "shake", "swing", "tada", "wobble", "bounceIn", "bounceInDown", "bounceInLeft", "bounceInRight", "bounceInUp", "bounceOut", "bounceOutDown", "bounceOutLeft", "bounceOutRight", "bounceOutUp", "fadeIn", "fadeInDown", "fadeInDownBig", "fadeInLeft", "fadeInLeftBig", "fadeInRight", "fadeInRightBig", "fadeInUp", "fadeInUpBig", "fadeOut", "fadeOutDown", "fadeOutDownBig", "fadeOutLeft", "fadeOutLeftBig", "fadeOutRight", "fadeOutRightBig", "fadeOutUp", "fadeOutUpBig", "flip", "flipInX", "flipInY", "flipOutX", "flipOutY", "lightSpeedIn", "lightSpeedOut", "rotateIn", "rotateInDownLeft", "rotateInDownRight", "rotateInUpLeft", "rotateInUpRight", "rotateOut", "rotateOutDownLeft", "rotateOutDownRight", "rotateOutUpLeft", "rotateOutUpRight", "hinge", "rollIn", "rollOut", "zoomIn", "zoomInDown", "zoomInLeft", "zoomInRight", "zoomInUp", "zoomOut", "zoomOutDown", "zoomOutLeft", "zoomOutRight", "zoomOutUp", "wiggle", "fade", "appear", "spinner", "twirlIn", "twirlOut", "grow", "shrink", "pulseGrow", "pulseShrink", "push", "pop", "rotate", "growRotate", "float", "sink", "skew", "skewForward", "skewBackward", "wobbleHorizontal", "wobbleVertical", "wobbleToBottomRight", "wobbleToTopRight", "wobbleTop", "wobbleBottom", "wobbleSkew", "buzz", "buzzOut", "forward", "backward"];
|
4 |
+
var delayClasses = ["delay1", "delay2", "delay3", "delay4", "delay5", "delay6", "delay7", "delay8", "delay9", "delay10", "delay11", "delay12"];
|
5 |
+
var durationClasses = ["duration1", "duration2", "duration3", "duration4", "duration5", "duration6", "duration7", "duration8", "duration9", "duration10", "duration11", "duration12", "duration13", "duration14", "duration15", "duration16", "duration17", "duration18", "duration19", "duration20"];
|
6 |
+
var scrollOffset = edsanimate_options.offset;
|
7 |
+
|
8 |
+
$('.eds-animation-paused').removeClass('eds-animation-paused');
|
9 |
+
|
10 |
+
$('.eds-on-scroll').each(function(){
|
11 |
+
var $module = $(this);
|
12 |
+
|
13 |
+
var classesToAdd = " eds-scroll-visible ";
|
14 |
+
|
15 |
+
$module.removeClass(function(index, className){
|
16 |
+
var removeClassList = "";
|
17 |
+
var classList = className.trim().split(/\s+/);
|
18 |
+
$.each(classList, function(index, value){
|
19 |
+
if(($.inArray(value, animationStyleClasses)!==-1)
|
20 |
+
|| ($.inArray(value, delayClasses)!==-1)
|
21 |
+
|| ($.inArray(value, durationClasses)!==-1))
|
22 |
+
removeClassList += " " + value;
|
23 |
+
});
|
24 |
+
|
25 |
+
classesToAdd += removeClassList;
|
26 |
+
return removeClassList;
|
27 |
+
});
|
28 |
+
|
29 |
+
$module.addClass("eds-scroll-hidden");
|
30 |
+
|
31 |
+
$module.edsViewportChecker({
|
32 |
+
classToAdd: classesToAdd,
|
33 |
+
offset: scrollOffset
|
34 |
+
});
|
35 |
+
|
36 |
+
});
|
37 |
+
|
38 |
+
$('.eds-on-click').each(function(){
|
39 |
+
var $module = $(this);
|
40 |
+
|
41 |
+
var classesToAdd = " ";
|
42 |
+
|
43 |
+
$module.removeClass(function(index, className){
|
44 |
+
var removeClassList = "";
|
45 |
+
var classList = className.trim().split(/\s+/);
|
46 |
+
$.each(classList, function(index, value){
|
47 |
+
if(($.inArray(value, animationStyleClasses)!==-1)
|
48 |
+
|| ($.inArray(value, delayClasses)!==-1)
|
49 |
+
|| ($.inArray(value, durationClasses)!==-1))
|
50 |
+
removeClassList += " " + value;
|
51 |
+
});
|
52 |
+
|
53 |
+
classesToAdd += removeClassList;
|
54 |
+
return removeClassList;
|
55 |
+
});
|
56 |
+
|
57 |
+
$module.click(function (){
|
58 |
+
$(this).removeClass(classesToAdd).addClass(classesToAdd).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
|
59 |
+
$(this).removeClass(classesToAdd);
|
60 |
+
});
|
61 |
+
});
|
62 |
+
|
63 |
+
});
|
64 |
+
|
65 |
+
$('.eds-on-hover').each(function(){
|
66 |
+
var $module = $(this);
|
67 |
+
|
68 |
+
var classesToAdd = " ";
|
69 |
+
|
70 |
+
$module.removeClass(function(index, className){
|
71 |
+
var removeClassList = "";
|
72 |
+
var classList = className.trim().split(/\s+/);
|
73 |
+
$.each(classList, function(index, value){
|
74 |
+
if(($.inArray(value, animationStyleClasses)!==-1)
|
75 |
+
|| ($.inArray(value, delayClasses)!==-1)
|
76 |
+
|| ($.inArray(value, durationClasses)!==-1))
|
77 |
+
removeClassList += " " + value;
|
78 |
+
});
|
79 |
+
|
80 |
+
classesToAdd += removeClassList;
|
81 |
+
return removeClassList;
|
82 |
+
});
|
83 |
+
|
84 |
+
var hovered = false;
|
85 |
+
$module.hover(
|
86 |
+
function (){
|
87 |
+
hovered = true;
|
88 |
+
$(this).removeClass(classesToAdd).addClass(classesToAdd).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
|
89 |
+
$(this).removeClass(classesToAdd);
|
90 |
+
});
|
91 |
+
},
|
92 |
+
function (){
|
93 |
+
hovered = false;
|
94 |
+
$(this).on('webkitAnimationIteration oanimationiteration msAnimationiteration animationiteration', function(e){
|
95 |
+
if(!hovered){
|
96 |
+
$(this).removeClass(classesToAdd);
|
97 |
+
}
|
98 |
+
});
|
99 |
+
}
|
100 |
+
);
|
101 |
+
|
102 |
+
});
|
103 |
+
|
104 |
+
|
105 |
+
});
|
106 |
})(jQuery);
|
edsanimate.php
CHANGED
@@ -5,7 +5,7 @@
|
|
5 |
* Domain Path: /lang
|
6 |
* Plugin URI: http://www.eleopard.in
|
7 |
* Description: Add cool CSS3 animations to your content.
|
8 |
-
* Version: 2.
|
9 |
* Author: eLEOPARD Design Studios
|
10 |
* Author URI: http://www.eleopard.in
|
11 |
* License: GNU General Public License version 2 or later; see LICENSE.txt
|
@@ -42,7 +42,7 @@ class EDS_Animate {
|
|
42 |
"rotateIn","rotateInDownLeft","rotateInDownRight","rotateInUpLeft",
|
43 |
"rotateInUpRight","slideInUp","slideInDown","slideInLeft","slideInRight",
|
44 |
"zoomIn","zoomInDown","zoomInLeft","zoomInRight","zoomInUp","flipInX",
|
45 |
-
"flipInY","lightSpeedIn","rollIn");
|
46 |
|
47 |
public function __construct( $file_loc ) {
|
48 |
|
@@ -157,6 +157,13 @@ class EDS_Animate {
|
|
157 |
|
158 |
if( $installed_version != $eds_animate_it_version ) {
|
159 |
/* Code Block to be used for next plugin upgrade */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
160 |
}
|
161 |
}
|
162 |
|
@@ -186,8 +193,9 @@ class EDS_Animate {
|
|
186 |
update_option('eds_enable_on_tab', $_REQUEST['eds_enable_on_tab']);
|
187 |
$ok=true;
|
188 |
}
|
189 |
-
|
190 |
-
|
|
|
191 |
|
192 |
if($ok){?>
|
193 |
<div id="message" class="updated fade">
|
@@ -282,8 +290,7 @@ class EDS_Animate {
|
|
282 |
<?php
|
283 |
}
|
284 |
|
285 |
-
function detect_device()
|
286 |
-
{
|
287 |
static $device_type = null;
|
288 |
|
289 |
if(!$device_type)
|
@@ -296,23 +303,21 @@ class EDS_Animate {
|
|
296 |
}
|
297 |
|
298 |
function add_eds_script_and_css() {
|
299 |
-
|
|
|
|
|
300 |
$device_type = $this->detect_device();
|
301 |
|
302 |
$enable_smart_phone = get_option('eds_enable_on_phone');
|
303 |
-
$enable_tablet = get_option('eds_enable_on_tab');
|
304 |
-
|
305 |
|
306 |
$enable= ($device_type=='phone' && intval($enable_smart_phone))
|
307 |
|| ($device_type =='tablet' && intval($enable_tablet))
|
308 |
|| ($device_type =='computer');
|
309 |
|
310 |
-
if($enable)
|
311 |
|
312 |
-
wp_register_style( 'edsanimate-animo-css',plugins_url( '/assets/css/animate-animo.css', self::$abs_file ));
|
313 |
-
|
314 |
-
//Custom CSS//
|
315 |
-
$custom_css = get_option('eds_custom_css');
|
316 |
|
317 |
wp_register_script( 'edsanimate-animo-script',plugins_url( '/assets/js/animo.min.js', self::$abs_file ), array('jquery'), '1.0.3', true);
|
318 |
|
@@ -334,16 +339,28 @@ class EDS_Animate {
|
|
334 |
|
335 |
//Enqueuing style sheets
|
336 |
wp_enqueue_style( 'edsanimate-animo-css' );
|
337 |
-
wp_add_inline_style( 'edsanimate-animo-css', $custom_css );
|
338 |
|
339 |
//Enqueuing javascripts
|
340 |
wp_enqueue_script( 'edsanimate-animo-script');
|
341 |
wp_enqueue_script( 'edsanimate-throttle-debounce-script' );
|
342 |
wp_enqueue_script( 'viewportcheck-script');
|
343 |
wp_enqueue_script( 'edsanimate-script');
|
344 |
-
wp_enqueue_script( 'edsanimate-site-script');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
345 |
|
346 |
-
endif;
|
347 |
}
|
348 |
|
349 |
function edsanimate_handler( $attributes, $content = null ) {
|
@@ -518,6 +535,6 @@ if( !defined( 'WPINC' ) ) {
|
|
518 |
|
519 |
global $eds_animate_it_version;
|
520 |
|
521 |
-
$eds_animate_it_version = '2.
|
522 |
|
523 |
new EDS_Animate( __FILE__ );
|
5 |
* Domain Path: /lang
|
6 |
* Plugin URI: http://www.eleopard.in
|
7 |
* Description: Add cool CSS3 animations to your content.
|
8 |
+
* Version: 2.3.0
|
9 |
* Author: eLEOPARD Design Studios
|
10 |
* Author URI: http://www.eleopard.in
|
11 |
* License: GNU General Public License version 2 or later; see LICENSE.txt
|
42 |
"rotateIn","rotateInDownLeft","rotateInDownRight","rotateInUpLeft",
|
43 |
"rotateInUpRight","slideInUp","slideInDown","slideInLeft","slideInRight",
|
44 |
"zoomIn","zoomInDown","zoomInLeft","zoomInRight","zoomInUp","flipInX",
|
45 |
+
"flipInY","lightSpeedIn","rollIn","twirlIn");
|
46 |
|
47 |
public function __construct( $file_loc ) {
|
48 |
|
157 |
|
158 |
if( $installed_version != $eds_animate_it_version ) {
|
159 |
/* Code Block to be used for next plugin upgrade */
|
160 |
+
/*For version 2.3.0 code to add custom css file is added.*/
|
161 |
+
$custom_css = get_option('eds_custom_css');
|
162 |
+
if($custom_css !== false && $custom_css != "" ){
|
163 |
+
file_put_contents( plugin_dir_path( self::$abs_file ) . "assets/css/custom.css", $custom_css);
|
164 |
+
}
|
165 |
+
update_option( 'eds_animate_it_version', $eds_animate_it_version );
|
166 |
+
|
167 |
}
|
168 |
}
|
169 |
|
193 |
update_option('eds_enable_on_tab', $_REQUEST['eds_enable_on_tab']);
|
194 |
$ok=true;
|
195 |
}
|
196 |
+
$custom_css = esc_textarea(isset($_REQUEST['eds_custom_css'])?$_REQUEST['eds_custom_css']:'');
|
197 |
+
update_option('eds_custom_css', $custom_css);
|
198 |
+
file_put_contents( plugin_dir_path( self::$abs_file ) . "assets/css/custom.css", $custom_css);
|
199 |
|
200 |
if($ok){?>
|
201 |
<div id="message" class="updated fade">
|
290 |
<?php
|
291 |
}
|
292 |
|
293 |
+
function detect_device() {
|
|
|
294 |
static $device_type = null;
|
295 |
|
296 |
if(!$device_type)
|
303 |
}
|
304 |
|
305 |
function add_eds_script_and_css() {
|
306 |
+
//Custom CSS//
|
307 |
+
$custom_css = get_option('eds_custom_css');
|
308 |
+
|
309 |
$device_type = $this->detect_device();
|
310 |
|
311 |
$enable_smart_phone = get_option('eds_enable_on_phone');
|
312 |
+
$enable_tablet = get_option('eds_enable_on_tab');
|
|
|
313 |
|
314 |
$enable= ($device_type=='phone' && intval($enable_smart_phone))
|
315 |
|| ($device_type =='tablet' && intval($enable_tablet))
|
316 |
|| ($device_type =='computer');
|
317 |
|
318 |
+
if($enable) {
|
319 |
|
320 |
+
wp_register_style( 'edsanimate-animo-css',plugins_url( '/assets/css/animate-animo.css', self::$abs_file ));
|
|
|
|
|
|
|
321 |
|
322 |
wp_register_script( 'edsanimate-animo-script',plugins_url( '/assets/js/animo.min.js', self::$abs_file ), array('jquery'), '1.0.3', true);
|
323 |
|
339 |
|
340 |
//Enqueuing style sheets
|
341 |
wp_enqueue_style( 'edsanimate-animo-css' );
|
342 |
+
wp_add_inline_style( 'edsanimate-animo-css', $custom_css );
|
343 |
|
344 |
//Enqueuing javascripts
|
345 |
wp_enqueue_script( 'edsanimate-animo-script');
|
346 |
wp_enqueue_script( 'edsanimate-throttle-debounce-script' );
|
347 |
wp_enqueue_script( 'viewportcheck-script');
|
348 |
wp_enqueue_script( 'edsanimate-script');
|
349 |
+
wp_enqueue_script( 'edsanimate-site-script');
|
350 |
+
} else {
|
351 |
+
if( file_exists( plugin_dir_path( self::$abs_file ) . "assets/css/custom.css" ) ) {
|
352 |
+
wp_register_style( 'edsanimate-custom-css',plugins_url( '/assets/css/custom.css', self::$abs_file ));
|
353 |
+
wp_enqueue_style( 'edsanimate-custom-css' );
|
354 |
+
} else {
|
355 |
+
if( $custom_css != null && trim($custom_css) != "" ) {
|
356 |
+
wp_register_style( 'edsanimate-blank-css',plugins_url( '/assets/css/blank.css', self::$abs_file ) );
|
357 |
+
wp_enqueue_style( 'edsanimate-blank-css' );
|
358 |
+
wp_add_inline_style( 'edsanimate-blank-css', $custom_css );
|
359 |
+
}
|
360 |
+
}
|
361 |
+
}
|
362 |
+
|
363 |
|
|
|
364 |
}
|
365 |
|
366 |
function edsanimate_handler( $attributes, $content = null ) {
|
535 |
|
536 |
global $eds_animate_it_version;
|
537 |
|
538 |
+
$eds_animate_it_version = '2.3.0';
|
539 |
|
540 |
new EDS_Animate( __FILE__ );
|
legal.txt
CHANGED
@@ -10,4 +10,5 @@ http://labs.bigroomstudios.com/libraries/animo-js
|
|
10 |
http://benalman.com/code/projects/jquery-throttle-debounce/docs/files/jquery-ba-throttle-debounce-js.html
|
11 |
|
12 |
CSS
|
13 |
-
http://daneden.github.io/animate.css/
|
|
10 |
http://benalman.com/code/projects/jquery-throttle-debounce/docs/files/jquery-ba-throttle-debounce-js.html
|
11 |
|
12 |
CSS
|
13 |
+
http://daneden.github.io/animate.css/
|
14 |
+
http://ianlunn.github.io/Hover/
|
readme.txt
CHANGED
@@ -2,8 +2,8 @@
|
|
2 |
Contributors: eleopard
|
3 |
Tags: css3 animation, animate.css, jquery, on scroll animation, delay, infinite, entry exit, iteration
|
4 |
Requires at least: 3.9
|
5 |
-
Tested up to: 4.9.
|
6 |
-
Stable tag: 2.
|
7 |
License: GNU General Public License version 2 or later
|
8 |
License URI: http://www.gnu.org/copyleft/gpl.html
|
9 |
|
@@ -82,6 +82,10 @@ Add duration class ( duration1 to duration20 ) along with the other classes. or
|
|
82 |
|
83 |
== Changelog ==
|
84 |
|
|
|
|
|
|
|
|
|
85 |
= Version 2.2.1 =
|
86 |
* Bug fixes for chrome 61+ version
|
87 |
|
2 |
Contributors: eleopard
|
3 |
Tags: css3 animation, animate.css, jquery, on scroll animation, delay, infinite, entry exit, iteration
|
4 |
Requires at least: 3.9
|
5 |
+
Tested up to: 4.9.2
|
6 |
+
Stable tag: 2.3.0
|
7 |
License: GNU General Public License version 2 or later
|
8 |
License URI: http://www.gnu.org/copyleft/gpl.html
|
9 |
|
82 |
|
83 |
== Changelog ==
|
84 |
|
85 |
+
= Version 2.3.0 =
|
86 |
+
* Added new CSS Animations. Thanks to http://ianlunn.github.io/Hover/
|
87 |
+
* Added support for loading custom CSS even if the animations are disabled on tablet or mobile devices.
|
88 |
+
|
89 |
= Version 2.2.1 =
|
90 |
* Bug fixes for chrome 61+ version
|
91 |
|