jQuery在指定位置插入元素动画特效

来源:https://www.sucaihuo.com/js/4711.html 2019-09-04 11:34浏览(87) 收藏

jQuery在指定位置插入元素动画特效,例如:eq(0)表示第1个元素后插入,可定义为变量,更加灵活。
jQuery在指定位置插入元素动画特效
分类:其它特效 > 动画效果 难易:初级
登录后点击“下载资源”按钮,复制链接,邀请好友免费下载
查看演示 下载资源: 2 下载资源 下载积分: 20 积分

js代码

<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/jquery.magicmove.js"></script> 
<script>
    jQuery(function ($) {
      $('button.animate1').click(function () {
        $('.containers').magicMove({
          easing: 'ease',
          duration: 300
        }, function () {
          var index = $(this).children().length + 1;
          var $el = $('<section>' + index + 'th</section>');
          $(this).find('section').eq(0).after($el);
        });
      });
      $('button.animate2').click(function () {
        $('.containers').magicMove({
          easing: 'ease',
          duration: 500
        }, function () {
          var index = $(this).children().length + 1;
          var $el = $('<section>' + index + 'th</section>');
          $(this).find('section').eq(2).after($el);
        });
      });
		
	  $('button.animate3').click(function () {
        $('.containers').magicMove({
          easing: 'ease',
          duration: 500
        }, function () {
          var index = $(this).children().length + 1;
          var $el = $('<section>' + index + 'th</section>');
          $(this).find('section').eq(1).after($el);
        });
      });
    });
</script>
标签: 元素插入
评论1
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 525945990

  • 头像 沙发
    09-04 15:42
    z***2
    好像很不错啊。你们觉得呢!
1 2