Suckerfish의 아들을위한 JS/JQ 픽스가 수정되었습니다.

Question

"Suckerfish의 아들"을 사용하여 탐색 메뉴 (실제로는 오른쪽으로 팝업)를 만듭니다.

일부 하위 메뉴는 상당히 길며 접기 부분 아래에 있습니다. (자바 스크립트/jQuery를 사용하여) 메뉴가 항상 스크롤없이 볼 수있는 부분 위에 있도록하는 방법이 있습니까? (뷰포트에 맞추기에는 너무 큰 메뉴가 맨 위에 올리면 정말 기쁩니다)?

Answer 1

결국 나는 답을 찾을 수 없으므로 스스로 해결할 수있었습니다. 나는이 blog post에서 그것을 설명하기 위해 노력했다

var winHeight = $(window).height(); 
$navULs = $('#nav ul'); 
$navULs.find('ul').each(function(i,v) { 
    $this = $(v); 
    var ulHeight = $this.height(); 
    var parentHeight = $this.closest('li').height(); 
    var parentTop = $this.offset().top; 
    var parentBottom = parentTop + parentHeight; 
    if ((winHeight - parentTop) < ulHeight) { 
     if (parentBottom < ulHeight) { 
      $this.css({ 
       'margin-top': '0px', // remove margin-top (added by suckerfish css) as it screws up the calculations 
       'top': '-' + (parentTop) + 'px' // move the menu up by the amount of px available above the parent's top 
      }); 
     } else { 
      $this.css('bottom', '0px'); // v basic, if sub menu will drop too much shove it up (css does the heavy lifting here) 
     } 
    } 
}); 

:

다음은 내가 사용하는 코드는 (jQuery를 필요)입니다.