시간 초과 이벤트 표시/숨기기

Question

다음을 시도하고 있습니다. 페이지가로드 될 때 잠깐 후에 트리거 할 예정인 표시/숨기기 이벤트가 있습니다. 사용자가 표시/숨기기 아이콘을 클릭하면 자동으로 시간 초과 기능이 트리거되지 않습니다.

표시/숨기기 사업부가 나타납니다

그것은 다음을 을 - 크게 사업부를 확장 - 디스플레이 숨겨진 내용 -를 제외하고, 나는 거의 모든 기능을 작동 한 아이콘

을 변경 작동하도록 setTimeOut. 나는 다른 페이지에서 작동하도록 만들었지 만, 어떤 이유에서이 페이지에서는 작동하지 않습니다. 업데이트 : 제한 시간 기능이 제대로 작동하지만 열리 자마자 열려있는 대신 즉시 닫힙니다.

알려 주시기 바랍니다.

JQuery와 : 여기

내가 현재 가지고있는 코드의

setTimeout(function (f) { 
    $('.show_hide_aboutus').click(); 
}, 1000); 
//For About Us Show/hide 
$('.show_hide_aboutus').click(function(f){ 

    f.preventDefault(); 
    clearTimeout(time); // cancels timeout 
    $(".slidingDiv").slideToggle('fast',function() { 
     $('.overlayAbout').toggleClass('animate', $(this).is(':visible')); 
     if ($('.animate').is(':visible')){ // Open 
      $('.showhideMenu').animate({ "margin-left": "-13px"}, 'fast'); 
      $('.showhideMenu').fadeIn('slow'); 
      $('.showWork').hide(); 
      $('.aboutContent').fadeIn('slow'); 
      $('.ourworkContent').fadeIn('slow'); 
      $('.overlayAbout').animate({ width: '29.5%', height: '100%'}, 'fast'); /* */ 
      $('.infoicon').toggleClass('infoicon arrow-left'); /* hides the up arrow */ 
      $('.arrow-right-down').toggleClass('arrow-right-down arrow-right'); /* hides the up arrow */ 
     } else { // Close  
      $('.overlayAbout').animate({ width: 69, height: 69}, 'fast'); /* */ 
      $('.ourworkContent').hide(); 
      $('.showWork').show(); 
      $('.aboutContent').hide(); 
      $('.arrow-left').toggleClass('arrow-left infoicon'); /* hides the up arrow */ 
      $('.arrow-right').toggleClass('arrow-right arrow-right-down'); /* hides the up arrow */ 
      $('.showhideMenu').hide(); 
     } 

    }); /* slidingDiv Toggle */ 

}); /* show_hide click function */ 

HTML :

<div class="overlayAbout"> 
    <a href="#" class="show_hide_aboutus"> 
     <div class="infoicon"> </div> 
     <div class="arrow-right-down"> </div> 

     <div class="showWork"> 
      Back to <br/> <a href="/about-us" id="aboutusLink">about us</a> 
     </div> <!--- showWork div link --> 
    </a> <!-- show_hide --> 
    <div class="slidingDiv"> 
     <div class="showhideMenu"> 
      Menu Stuff 
     </div> 
     <div class="large-9 columns margintop-small aboutContent"> 
      <div class="scrolling"> 
       Test setwlewjlj wlerjwlerj 
      </div> 
     </div> 

    </div> <!-- large-9 columns margintop --> 
</div> <!--slidingDiv --> 
</div> <!-- overlayAbout --> 

CSS :

.slidingDiv { color: #4F4E4E; display: none;} 
.overlayAbout{ 
    position: absolute; 
    z-index: 1; 
    width: 69px; 
    height: 69px; 
    background-color: white; 
    color: #4F4E4E; 
    opacity: 0.8; 
    filter:alpha(opacity=95); 
    padding: 10px 15px; 
    line-height: 20px; 
    border: 1px solid #000; 
} 
.showhideMenu{ display: none; } 
.showWork{ 
    line-height: 15px; 
    width: 70px; 
    margin: 0px 0 0 -15px; 
    text-align: center; 
} 
.showWork a{ font-size: 9px; color: #334444; line-height:11px; } 
.aboutContent{ display: none; } 

Answer 1

시간 제한에 오타가있다 함수

는

$('show_hide_aboutus').click(); 

$('.show_hide_aboutus').click();