2014-10-25 2 views
0

다음/이전 div 탐색을 시도하고 있습니다. Google에서 많이 검색했지만 필요한 정보를 정확히 찾을 수 없습니다. 모든다음 div, 이전 div 탐색

첫째, 나는이 래퍼 또는 종류의 아무것도를 추가로 더 의미

<html> 
<body> 
<a name="1"></a> 
<div class="section">Blah blah</div> 
<a name="2"></a> 
<div class="section">Blah blah</div> 
<a name="3"></a> 
<div class="section">Blah blah</div> 
</body> 
</html> 

그대로 내 HTML 구조를 유지하지 싶습니다. 적절한 <a> 태그에 스크롤을 트리거

2 링크/버튼 : 나는 네비게이션 시스템에서 원하는 무엇

는 다음과 같습니다.

내비게이션에 position: fixed;이 있어야하므로 스크롤하는 동안 필요한 장소에 머물러있게됩니다.

마지막으로, 내가 찾지 못한 것은 탐색 버튼이 중첩하는 것을 기반으로 현재 위치를 감지하는 것입니다. 버튼이 <a name="2"></a> 아래에 있지만 <a name="3"></a> 위에있는 동안 다음 누르면

의미, 그것은 당신이 당신의 요소에 ID를 추가 할 수 있습니다 필요 <a name="3"></a>

+0

''구문이 잘못되었습니다. '> '대신에'<'가 붙습니다. – Barmar

+0

변수에 현재 DIV 이름을 입력하십시오. 그런 다음'.next()'와'.prev()'와 같은 jQuery의 DOM 탐색 메소드를 사용하여 이동할 DIV를 찾으십시오. – Barmar

답변

0

버튼 요소에 현재 위치를 나타내는 데이터 속성을 추가 한 다음 버튼을 클릭하면 마지막 속성을 다시 읽습니다. 나는 따르므로 코드를 테스트 할 수 없으므로 내 전화를 사용하고 있지만 잘하면 시작할 수 있습니다.

<a id="next" data-current="1">》</a> 
<a id="prev">《</a> 

function getCurrent() { 
    return parseInt($("#next").attr ("data-current").val()); 
} 

function setCurrent(idx) { 
    $("#next").attr("current", idx); 
} 

$("#next").on ("click", function() { 
    val idx = getCurrent() + 1; 
    if (idx > 3) idx = 1; 
    navigateTo(idx); 
    setCurrent (idx); 
}); 

// do the same for previous, if (idx < 1) idx = 3; 
+0

어떤 이유로 든 작동하지 않는 것으로 보아 몇 차례 코드를 살펴 보았지만 문제를 볼 수는 없습니다. jsfiddle을 만들 수 있을까요? –

+0

나는 내 전화기 위에있다. jquery로 사용자 정의 속성을 설정하는 방법을 찾으십시오. – Jason

0

아래로 스크롤하고 당신은 클래스를 사용하여 이전에 탐색 할 수 있습니다 다음 것.

<html> 
<body> 
<a name="1"></a> 
<div class="section">Blah blah</div> 
<a name="2"></a> 
<div class="section">Blah blah</div> 
<a name="3"></a> 
<div class="section">Blah blah</div> 
</body> 
</html> 

$(a).click(function(){ 
if($(this).attr('name') == "3"){ 
    $(this).prev().click(); 
    } 
}) 

참고 : 다음 및 이전 값을 탐색하는 방법의 예입니다.