10 초 후에 팝업을 표시하려면이 코드에 무엇을 추가해야합니까?

Question

간단한 팝업이 나타날 때까지 내 페이지에서 5 ~ 10 초 동안 머 무르려면 방문자가 필요합니다. 닫기 버튼이 30 초 후에 나타나지만 그림자를 제외한 다른 요소는 페이지 외부의 잘못된 위치에 나타 났으므로 setTimeout 함수를 시도했습니다. 여기에 올바른 아이디어가 있습니까?

var shadow = $('<div id="shadowElem"></div>'); 
var speed = 1000; 
$(document).ready(function() { 
    $('body').prepend(shadow); 
}); 
$(window).load(function() { 
    screenHeight = $(window).height(); 
    screenWidth = $(window).width(); 
    elemWidth = $('#dropElem').outerWidth(true); 
    elemHeight = $('#dropElem').outerHeight(true) 

    leftPosition = (screenWidth/2) - (elemWidth/2); 
    topPosition = (screenHeight/2) - (elemHeight/2); 

    setTimeout(function() { 
    $("#dropClose").show(); 
    }, 30 * 1000); 

    $('#dropElem').css({ 
     'left' : leftPosition + 'px', 
     'top' : -elemHeight + 'px' 
    }); 
    $('#dropElem').show().animate({ 
     'top' : topPosition 
    }, speed); 

    shadow.animate({ 
     'opacity' : 0.7 
    }, speed); 

    $('#dropClose').click(function() { 
     shadow.animate({ 
      'opacity' : 0 
     }, speed); 
     $('#dropElem').animate({ 
     'top' : -elemHeight + 'px' 
    }, speed, function() { 
      shadow.remove(); 
      $(this).remove(); 
     });    
    }); 
}); 

Answer 1

당신이 밀리 초 단위로 지정된 수의 지연 원하는 지연 자바 스크립트 에서는 setTimeout() 방법을 사용한다 : 이것은 내가 지금까지 가지고있는 코드입니다.

당신은

setTimeout(function() { 
    $('#dropElem').show().animate({ 
     'top' : topPosition 
    }, speed); 
}, 10000); 

대신

$('#dropElem').show().animate({ 
    'top' : topPosition 
}, speed); 

Answer 2

의 근로자를 시도해야하지만, 팝업이 등장 할 때까지 화면이 때문에 shadowElem 타이밍의 어두운 머물렀다. I는 둘 사이의 차이는 약간 덜 수 있도록 팝업 애니메이션 타이밍 7초로 설정 #shadowElem

또한

에 CSS에

setTimeout(function() { 
    $("#shadowElem").show(); 
    }, 5 * 1000); 

및

display:none; 

추가 좌절