스크립트에서 다른 탭이 열리면서 한 탭이 ​​닫히지 않게하려면 어떻게해야합니까?

Question

그래서 나는 3 스크립트

이

탭을 하나 열고()하는 MouseLeave에 종료 스크립트 (1) 탭을 열고 2()하는 MouseLeave에 종료

$(document).ready(function(){ 
var myTimeOut; 
var rightSlide1 = ".rightslide1"; 

$(rightSlide1).mouseenter(function(){ 
    myTimeOut = setTimeout(function(){ 
     $(rightSlide1).stop(true,true).animate({"left": "9.5vw"}, "300"); 
    }, 1000); 
}); 


$(rightSlide1).mouseleave(function(){ 
    clearTimeout(myTimeOut); 
    $(rightSlide1).animate({"left": "37vw"}, "300"); 
}); 

스크립트 2

$(document).ready(function(){ 
    var myTimeOut; 
    var rightSlide1 = ".rightslide1"; 
    var rightSlide2 = ".rightslide2"; 

    $(rightSlide2).mouseenter(function(){ 
     myTimeOut = setTimeout(function(){ 
      $(rightSlide1).stop(true,true).animate({"left": "9.5vw"}, "300"); 
      $(rightSlide2).animate({"left": "14vw"}, "300"); 
     }, 1000); 
    }); 


    $(rightSlide2).mouseleave(function(){ 
     clearTimeout(myTimeOut); 
     $(rightSlide1).animate({"left": "37vw"}, "300"); 
     $(rightSlide2).animate({"left": "41.5vw"}, "300"); 
    }); 
});    

스크립트 1,2는 3 번 탭을 열고 mouseleave()시 모두 닫습니다.

$(document).ready(function(){ 
    var myTimeOut; 
    var rightSlide1 = ".rightslide1"; 
    var rightSlide2 = ".rightslide2"; 
    var rightSlide3 = ".rightslide3"; 

    $(rightSlide3).mouseenter(function(){ 
     myTimeOut = setTimeout(function(){ 
      $(rightSlide1).stop(true,true).animate({"left": "9.5vw"}, "300"); 
      $(rightSlide2).animate({"left": "14vw"}, "270"); 
      $(rightSlide3).animate({"left": "18.5vw"}, "300"); 
     }, 1000; 
    }); 


    $(rightSlide3).mouseleave(function(){ 
     clearTimeout(myTimeOut); 
     $(rightSlide1).animate({"left": "37vw"}, "300"); 
     $(rightSlide2).animate({"left": "41.5vw"}, "270"); 
     $(rightSlide3).animate({"left": "46vw"}, "300"); 
    }); 
});     

기본적으로이 페이지에는 3 개의 탭이 있습니다. 1 | 2 | 3 | 탭을 열고 서로 밀어 붙일 수 있기를 원합니다. 내가 원하는대로 왼쪽으로 슬라이드 탭을 얻었으나 문제는 이제 누군가가 탭 2를 여는 동안 탭 1을 열린 상태로 유지하는 방법을 파악할 수 없습니다. 탭 2를 열면 바로 닫힙니다. 당신이 떠날 때, 바로 당신의 탭 닫기하지만 개방은 1 초 지연된다

문제 # 1 :

Answer 1

가 문제를 일으키는 두 개의 작은 문제가있다. 그렇게 유지하려면 탭이 항상 먼저 닫히고 지연 될 수 있습니다. 지연 시간을 줄이면 동시에 닫히고 열릴 수 있습니다. 그러나, 그들은 조금 너무 미끄러 져 계속됩니다. 지연을 없애거나 가까운 애니메이션에도 추가하는 것이 좋습니다. 아코디언을 입력 할 때 하나의 일반적인 지연을 만들 수도 있습니다.

문제 # 2 : 이것이 더 중요한 문제입니다. jQuery의 stop() 메소드를 사용하고있다. 첫째, 모든 애니메이션에서 일관되게 사용해야하므로 즉시 실행되고 대기열에 저장되지 않으므로 매우 이상한 동작이 발생할 수 있습니다. 둘째, 두 번째 매개 변수를 으로 설정하지 마십시오.. 이렇게하면 현재 애니메이션이 바로 끝까지 이동하여 탭이 "건너 뛰게"됩니다. 대신 거짓으로 설정하면 탭이 현재 위치에서 멈추고이 지점부터 새 애니메이션이 계속됩니다. 이렇게하면 사용자 환경이 훨씬 향상됩니다.

지연을 없애고 두 번째 매개 변수를 변경하면 닫기가 서로 아름답게 밀려납니다.

안부와

,
Syntac