2014-02-23 8 views
0

약 한 시간 동안 답변을 검색해 왔지만 제대로 된 것을 찾을 수 없습니다.Jquery로 초점을 맞춘 항목으로 스크롤

아이콘이있는 가로선 타임 라인이 있습니다. 각 아이콘에 tabindex를 추가 했으므로 타임 라인/아이콘 (간단히 : 호버 및 : 포커스 CSS로 강조 표시되어 있음)을 탭할 수 있습니다.

나는 ... 현재 포커스 아이콘으로 페이지 스크롤을 보장 일부 JQuery와, 어딘가 가까운 (수평) 중심에 사용자 화면과 idealy 부드러운 스크롤 어떤 종류의 이상적인 위치를 추가 할

나는 scrollTo를 보았지만 필요한 것을 찾지 못했습니다.

도와주세요!

감사합니다 :)

답변

0

난 당신이 플러그인을 참조하고 추측하고있어 :

$('.icon').on('focus', function(){ 
$.scrollTo($(this), duration, settings) 
}) 

기간은 다음과 같습니다 https://github.com/flesler/jquery.scrollTo

이 경우 당신이 그런 짓을해야합니다 애니메이션 지속 시간

오프셋에서 포커스가있는 요소가 뷰포트에 원하는 위치에 배치되도록 오프셋을 추가해야합니다.

+0

이것은 나를 위해 일하지 않습니다, $ ('theicon')을했습니다. on ('focus', function() {alert ('here'); \t}}; 내가 사업부에게 가져이나 탭 때 경고가도 트리거되지 않습니다 ... –

+0

내가 (() 함수 초점을 맞 춥니 다. ('. theicon')를 $로 첫 번째 라인을 변경 {하고 작업있어. 내가 통과 무엇을 설정 섹션에서 질문의 div를 화면 중앙에 더 많이 또는 덜 앉아있게 할 수 있습니까? –

+1

포커스는 양식 요소 (선택, 입력 등) 및 링크에서만 사용할 수 있으며 모든 요소를 ​​포함하도록 이벤트를 확장 할 수 있습니다 tabindex 속성을 추가하여 –