2011-07-27 3 views
0

datepicker처럼 입력 필드에 첨부 된 입력 폼을 표시하려고합니다.JQuery : datepicker 스타일의 입력 필드에 입력 양식 첨부

"show"기능을 시도했지만 대신 입력 양식을 겹쳐서 표시하는 대신 숨겨진 내용을 표시하고 나머지 페이지를 아래로 이동합니다.

외부에 많은 오버레이 라이브러리가 있지만 "datepicker"처럼 입력 필드에 오버레이 된 양식이 첨부되어 있지 않습니다.

이 작업을 수행하는 간단한 방법이 있습니까? (jQuery 또는 jQuery UI가 아닌 다른 외부 라이브러리는 없음).

감사합니다.

답변

0

CSS 관련 문제가 있습니다.

.show()를 통해 보여주는 DIV에 절대 위치 지정을 적용하면됩니다.

예 :

// jQuery is : 
$('#yourDiv').addClass('yourDivClass'); 

/* CSS is : */ 
.yourDivClass { 
    position: absolute; 
    top: 50px; 
    left: 100px; 
} 

가 왼쪽 상단 값 귀하의 likings을 조정합니다.

+0

맞다면 : 절대 위치 속성은 0,0을 기준으로 디스플레이의 정확한 위치에 입력을 표시합니다. 하지만 내가 한 말은 : 입력란 바로 아래에 오버레이 스타일로 입력을 표시하려면 ... datepicker처럼. 감사합니다. – NoRiM

+0

정확히는 부모 DIV에 따른 것입니다. 테스트 페이지에서 그걸 가지고 놀고 그것이 당신에게 어떻게 맞는지보십시오 :-). 또한'display : block;'을 사용하는 것을 잊지 마십시오. –

0

내가 아는 한, 라이브러리 나 플러그인이 없다. (틀렸다면 정정 해줘.) 양식의 CSS 절대 위치 지정을 사용해야하며 폼의 top/left 속성을 입력 필드의 offset으로 설정해야합니다. 여기에 내가 할 방법에 대한 간단한 예가 나와 있습니다. http://jsfiddle.net/85ZkV/

+0

좋아요! 고마워. 정말 도움이된다. – NoRiM