테스트 사이트 - 개발 중인 베타 버전입니다

SIR

로그인 회원가입

목록으로

이전글 다음글

코딩 관련 문의 드립니다. (버튼영역이 겹치는 레이아웃) 채택완료

동물원 9년 전 조회 4,153

목록

아래 첨부된 이미지와 같이 1~5번 버튼이 겹쳐져 보이게 하고, 각 버튼에 오버롤 효과를 주고 싶은데요.

버튼이 겹쳐져 있는 영역들이 있어서, 어떻게 구현해야 할 지 모르겠네요.

이런 경우에 어떻게 코딩해야 할까요?

조언 부탁 드려요.

#그누보드5 #오버롤 #코딩 #태그

댓글을 작성하려면 로그인이 필요합니다.

답변 3개

정렬:

샤이닝

9년 전

</strong><span style="font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px; background-color: rgb(255, 255, 255);"><!DOCTYPE html></span><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><span style="font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px; background-color: rgb(255, 255, 255);"><html></span><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><span style="font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px; background-color: rgb(255, 255, 255);"><body></span><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><span class="marked" style="box-sizing: border-box; color: rgb(232, 0, 0); font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><?php<br style="box-sizing: border-box;">echo "My first PHP script!";<br style="box-sizing: border-box;">?></span><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><span style="font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px; background-color: rgb(255, 255, 255);"></body></span><br style="box-sizing: border-box; font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px;"><span style="font-family: Consolas, 'courier new'; font-size: 16px; line-height: 22.4px; background-color: rgb(255, 255, 255);"></html></span><strong style="color: rgb(127, 127, 127); font-family: 돋움, Dotum, sans-serif; font-size: 12px; line-height: normal;">

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

웨비온

9년 전

port님이 말씀하신것 처럼 버튼별로 클래스를 잡으시고 z-index값과 좌표값을 설정하시면 됩니다.

아래 예제는 참고하세요.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

port

9년 전

제 생각에는 각 버튼을 div로 구성하고 div에 층번호 z-index를 지정해 놓고요.

해당 버튼에 롤오버 했을때 층번호가 기존에 존재하는 층번호보다 1이 크게 해서 위로 오도록 구성하면

어떨까 싶습니다.

롤오버 했을때 층번호를 변경하는 것은 자바스크립트나 제이쿼리를 이용하시면 될 듯 하고요.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.