Question

我正在使用jQueryUI和一个Polymer弹出对话框，我隐藏了一个div，然后从ajax加载一张个人资料照片的数据，并用图像元素弹出div并让它淡入。据我所知，它在另一个部分中以同样的方式完成这一过程，它会逐渐淡化而不是滑动。我在这里删除了很多代码，因为我发现它对问题没有影响。

function supervisorAccountPopup(e) {

    var button = e.target;

    while (!button.hasAttribute('data-dialog') && button !== document.body) {
        button = button.parentElement;
    }


    if (!button.hasAttribute('data-dialog')) {

        return;

    }

    var dialogID = button.getAttribute('data-dialog');
    var dialog   = document.getElementById(dialogID);

    if (dialog) {

    $('#supervisorPopupProfilePic').hide();


        dialog.open();

        $.ajax({
            type: 'POST',
            url: 'getProfileImage.php',
            data:{'userID':<? echo $createdByID; ?>, 
                  'size'  :'big'},
            tryCount:0,
            retryLimit:5,
            cache:false,
            success: function(data) {   

                var profileData = JSON.parse(data);

                if(profileData[0].profilePhotoFullpath != ""){

                    $('#supervisorPopupProfilePic').html("<img class='profileImgPopup' id='supervisorPopupProfilePicIMG' src='uploads/profile/" + profileData[0].profilePhotoFullpath + "?" + new Date().getTime() + "'>");

                    var supervisorPopupProfilePic = document.getElementById('supervisorPopupProfilePicIMG');

                    supervisorPopupProfilePic.onload = function () {
                        $('#supervisorPopupProfilePic').show('fade');       
                    };

                }else{

                    $('#supervisorPopupProfilePic').html("<img id='supervisorPopupProfilePicIMG' class='profileImgPopup' src='uploads/profile/_default/defaultProfileImage_big_noBorder.png'>");

                    var supervisorPopupProfilePic = document.getElementById('supervisorPopupProfilePicIMG');

                    supervisorPopupProfilePic.onload = function () {
                        $('#supervisorPopupProfilePic').show('fade');       
                    };

                }


            },
            error : function(xhr, textStatus, errorThrown ) {

                this.tryCount++;

                if (this.tryCount <= this.retryLimit) {
                    //try again
                    $.ajax(this);
                    return;
                }    

                return;

            }
        });

     }

}

Answer 1

你在这里使用了淡入淡出选项：$（＆＃39;＃supervisorPopupProfilePic＆＃39;）。show（＆＃39; fade＆＃39;）;

要将内容滑入和滑出，如果只需要单个操作，则可以使用slideToggle（）或slideDown（）。你不需要show（）;

button.click(function() {
  $('#supervisorPopupProfilePic').slideToggle( "slow", function() {

  });
});

或

button.click(function() {
  $('#supervisorPopupProfilePic').slideDown( "slow", function() {

  });
});

是什么导致jQuery UI滑动而不是淡出？

1 个答案: