Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/jquery-ui/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript jquery动画不断减法_Javascript_Jquery_Html_Asmselect - Fatal编程技术网

Javascript jquery动画不断减法

Javascript jquery动画不断减法,javascript,jquery,html,asmselect,Javascript,Jquery,Html,Asmselect,我正试图用asmselect的方法制作列表项的动画,但它似乎一直在从高度减去2px,而不是加减 <script type="text/javascript"> $(document).ready(function() { $('#name').change(function(){ $('#name option:selected').each( function() { /*$('.asmListItem').animate

我正试图用asmselect的方法制作列表项的动画,但它似乎一直在从高度减去2px,而不是加减

<script type="text/javascript">
$(document).ready(function() {

$('#name').change(function(){
    $('#name option:selected').each( function() {       


                /*$('.asmListItem').animate({
                    opacity: "show",
                    height: "show"
                }, 100, "swing", function() { 
                    $('.asmListItem').animate({
                        height: "+=2px"
                    }, 50, "swing", function() {
                        $('.asmListItem').animate({
                            height: "-=2px"
                        }, 25, "swing"); 
                    }); 
                });*/
                $('#select-to')
                  .append("<li class='asmListItem' value='"+$(this)
                  .val()+"'><span class='asmListItemLabel'>" + '<b>'+$('#subnam').val() + ' </b>' + $(this)
                  .text()+"</span><a href=# class='asmListItemRemove'>remove</a></li>");

        $(this).remove();
    });
});

 $('.asmListItemRemove').live('click', function() {
            $(this).closest('li').remove();

$(文档).ready(函数(){
$('#name').change(function(){
$(“#名称选项:选定”)。每个(函数(){
/*$('.asmListItem')。设置动画({
不透明度:“显示”,
高度:“显示”
},100,“swing”,函数(){
$('.asmListItem')。设置动画({
高度:“+=2px”
},50,“摆动”,函数(){
$('.asmListItem')。设置动画({
高度:“-=2px”
},25,“摇摆”);
}); 
});*/
$(“#选择至”)
.append(“
  • ”; $(this.remove(); }); }); $('.asmlistitemrove').live('click',function(){ $(this).最近('li').remove();
  • }))

    }))


    有什么想法吗?

    似乎每次动画都会使li元素变得越来越小

    我不知道您的标记是什么样子的,所以我尝试在这里复制它:

    我不是将高度增加2px,然后在一个动画完成时将其减少2px,而是存储原始高度值,将其增加2,然后将其恢复到原始高度

               $('.asmListItem').animate({
                    opacity: 'show',
                    height: 'show'
                }, 100, "swing", function() { 
                    var originalHeight = $('.asmListItem').height();
                    $('.asmListItem').animate({
                        height: originalHeight + 2 + "px"
                    }, 50, "swing", function() {
                        $('.asmListItem').animate({
                            height: originalHeight + "px"
                        }, 25, "swing"); 
                    }); 
                });
    

    您能给我们看一下您正在使用的完整代码吗?