2011-01-11 12 views
0

먼저 다른 일을하는 방법에 대한 제안이 열려 있습니다.이 상황에서 목록의 스타일 데이터를 만드는 가장 좋은 방법은 무엇입니까?

here를가는 (가지 나쁜 페인트 작업에 대한 미안) 내가 무엇을 달성하고자하는의 이미지입니다 얻으려면

OK .. 나는 떨어져 발사와 JSON의 톤을 다시 전송됩니다 요청이 학생 이름, 성별, 연령, 위치에 대한 정보가 포함되어 있습니다.

나는 목록 요소의 형태로 일종의 테이블을 만들고 싶다. 각각의 튜플은 요청이 반환하는 유일한 학생 한 명을 포함하고있다.

특정 스타일로 스타일을 지정하고 싶기 때문에 행으로 표시되지만 각 데이터 조각은 테두리가있는 특정 너비와 같이 세포 모양으로 나타납니다. 데이터의 각 조각과 마찬가지로 고유 한 HTML 요소에 특정 CSS 스타일이 있지만 사용자에게는 단일 행으로 보입니다. (도면의 두 번째 및 세 번째 이미지와 동일)

튜플 (행)의 데이터 요소를 가리키면 해당 행에있는 모든 셀의 호버 상태가 변경됩니다.

끝 셀에 플러스가 포함되어 있으면 페이지의 다른 div에있는 데이터가 업데이트됩니다. 반면에 연속적으로 다른 셀을 클릭하면 특정 학생과 관련된 다른 페이지로 이동하게됩니다.

자바 스크립트 이외의 다른 것을 사용하지 않고 (라이브러리는 괜찮습니다. 예 : jQuery) CSS 어떻게이 문제를 해결하는 가장 좋은 방법이 있습니까?

내 생각은 괜찮습니까? 아니면 더 좋은 방법이 있습니까?

내 요청에 따라 25 개의 결과가 나타나면 한 번에 10 개만 표시하려고하지만 그 사람은 나머지 15 개를 어떻게 든 볼 수 있어야합니다. 어떻게해야합니까?

미리 감사드립니다.

+3

테이블을 정확히 사용하지 않는 이유는 무엇입니까? – Hoatzin

+0

@Hoatzin : 당신의 오른쪽 테이블이 이것에 맞습니다 - 아마도 가장 좋은 방법입니다. 그러나 제가 논의하는 접근 방법은 제가 생각하기에 더 많은 것을 생각하고 있습니다. – Julio

답변

0

나는 순간에 이것을 테스트 할 수있는 도구를 가지고 있지 않지만, 그것은 예를 들어, 행 컨테이너에 호버 속성을 설정 작동 할 수 있습니다 : 그런

div.row:hover div.cell { 
    background: #006; 
} 

또는 무언가를.

10/25 요소를 보여 주겠습니까? 자바 스크립트로 숨길 수 있고 버튼을 표시하여 추측 할 수 있습니다. 이유는 확실하지 않습니다. 결과에 페이지 매김을하려면 서버 측에 구현하는 것이 더 좋습니다.

관련 문제