css 값 가져오기가 가능한가요?

css 값 가져오기가 가능한가요?

QA

css 값 가져오기가 가능한가요?

답변 2

본문

bxslider를 모바일에 적용중입니다. pager를 viewport위쪽으로 배치하고 싶은데 heigth값이 기기의 width값에따라 변동되어서 pager의 위치가 화면의 크기에 따라 들쭉날쭉합니다. ㅠㅠ

 

대략적인 소스코드입니다.

<div class="bx-wrapper" style="max-width: 640px;">

<div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 644px;"></div>

<div class="bx-controls bx-has-pager" style="position: relative; bottom: "></div>

</div>

 

제가 궁금한것은 css에서  bx-viewport의 height 값을 변수에 넣고 그변수를  bx-controls bx-has-pager의 bottom값에 넣는 방식이 가능한가요?

 

css에서 변수를 사용해 본적이 없어서 질문드립니다.

 

 

 

이 질문에 댓글 쓰기 :

답변 2

css에 바로 변수를 적용할 수는 없습니다.

어떻게든 javascript로 컨트롤 될 수 있어야 합니다.

웹브라우저에서 변수로 어떤 값을 할당하거나 연산을 할려면

javascript로만 가능합니다.

위 문제는 아래 처럼 처리하시면 될것 같네요.

물론 jquery가 설치되어 있다는 가정하에서요.

 

<script>
$(function() {
    var a = $(".bx-viewport").css("height");
    $(".bx-has-pager").css("bottom", a);
});
</script>

 

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 23
© SIRSOFT
현재 페이지 제일 처음으로