Div 이미지/슬라이드를 클릭하면 JQuery에서 새로운 div를 볼 수 있습니까?

Question

전 사업부에 이미지 나 링크를 클릭 할 수있는 방법을 찾고 있어요 그리고 ... 높이로 변경하지 않고 다른 사업부로 밀어 그래서 뭔가 아래

<div id="div1"> 
<img src="image.jpg" onclick="slide_to_other_div" /> 
</div> 

<div id="div2" style="display:none"> 
<p>Another Div Here</p> 
</div> 

처럼하지만 내가 원하지 않는 것 아코디언 효과 ... 높이에 영향을주지 않고 Div2로 슬라이드하고 싶습니다.

는

하면 테이블이 있다고 가정 ... 추가 설명>

<table> 
<tr> 
    <td id="div1"><a href="#div2">Slide to Div2 Direction --> </a></td> 
    <td> id="div2" style="display:none">This is Div 2</td> 
</tr> 
</table> 

그래서, DIV2

Answer 1

나는 이 아닙니다. 나는 당신이 원하는 것을 알고 있습니다. 그러나 여기에 목표를 달성 할 수있는 일련의 단계가 있습니까?

1. 현재 이미지 높이를 계산하고 변경되지 않도록 명시 적으로 설정하십시오.
2. 는
3. 절대 DIV2 위치
4. 달린 것을 빼낸 div1의 이미지를 계산 현재 절대 화상 위치 계산은 이전에 계산 된 절대 위치에 위치 절대하는 스타일의 설정 및
5. 애니메이션 본체에 부착 위치의 위쪽 및 왼쪽 특성 새로운 위치
6. 달린 것을 빼낸 본체로부터의 화상에 그것을 "슬라이드"절대 위치 값을 제거 DIV2에 부착하고 DIV2

표시하므로 그게 당신이 찾고있는 것과 같습니까? 각 단계는 jquery를 통해 수행 할 수 있습니다.

---

편집 : 지금 내가 당신을 더 이해하고있어 생각, 당신은 아마 수평 아코디언을 찾고 있습니다. 이 코드를 처음부터 작성할 수는 있지만 기존 솔루션을 살펴 보거나 (또는 ​​단순히 사용하는 것이 좋습니다). Here은 그 중 하나의 예입니다. 구글 "수평 accordian"그게 당신의 공상에 적합하지 않은 경우 더 찾을 수 있습니다.

Answer 2

에 링크를 추가 HTML을 클릭 옆 DIV2에 Div1 스크롤 :

<a name="myAnchor"></a> 

Jquery :

$('#div1 img').click(function(){ 
window.location = "/currentpath_or_link#myAnchor"; 
}); 

멋진 애니메이션을 제공하지는 않으나 거기에 도달하게됩니다. 멋진 애니메이션을 원한다면 기능이 필요합니다. scrollTo() 그러나 나는 그 일을 한 적이 없습니다.