문제

웹 사이트에 메시지를 표시 해야하는 짧은 기능이 있습니다.

function showHint() { 
    $('#notify').html('message text').show('slide', {direction: 'right'}, 500);
}

그리고 메시지를 숨기는 또 다른 기능이 있습니다.

function hideHint() { 
    $('#notify').hide('slide', {direction: 'right'}, 500);
}

문제는이 기능을 한 번 이상 호출하면 모든 메시지를 동시에 보여주고 모든 것이 깨지는 것입니다. 기능을 두 번 호출 한 다음 애니메이션을 대기하고 한 메시지를 표시해야합니다. 함수는 동시에 한 번 이상 호출되어야하지만 차례로 표시해야합니다. FIRS가 숨어있을 때 다음 메시지가 표시되어야합니다.

문제를 어떻게 해결할 수 있습니까? 좋은 것!

도움이 되었습니까?

해결책

다음은 과거에 사용한 미니 사용자 정의 플러그인이 있습니다.

// Good for serializing animations
$.fn.chain = function(fn) {
  var elements = this;
  var i = 0;
  function nextAction() {
    if (elements.eq(i)) fn.apply(elements.eq(i), [nextAction]);
    i++;
  }
  nextAction();
};

당신은 그것을 그렇게 부를 수 있습니다 (다음은 사용중인 예입니다):

$(document).ready(function() {
  $('li').chain(function(nextChain) { this.slideToggle("fast", nextChain); });
});

당신이 전달하는 함수 chain 한 주기로 다운 할 때 호출 해야하는 다른 기능을 전달합니다. 위의 예에서 우리는 단지 전달됩니다 nextChain 콜백으로 작동합니다 slideToggle.

다른 팁

Showhint 기능은 알림을 숨기면서 시작할 수 있으며 그것이 완료되면 콜백은 기존의 showhint 함수가 될 것이므로 텍스트를 변경하고 표시합니다. 이미 수행 한 작업을 감안할 때 코드는 어렵지 않아야합니다.

알림 플러그인 만 사용할 수 없습니까? 여기에 두 가지가 있습니다 (하나, ) 그건 꽤 으스스합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top