자바 스크립트를 사용하여 의사 요소 CSS 동적으로

Question

의사 요소의 CSS를 동적으로 설정할 수 있습니까? 예를 들면 :

동적 도움말 용기를 스타일링

jQuery를

$('#help').css({ 
    "width" : windowWidth - xOffset, 
    "height" : windowHeight - yOffset, 
    "bottom" : -windowHeight, 
    "left" : 200 
}); 

내부 도움말 컨테이너의 경계 설정에 jQuery를 시도 : 위의

에 대한

$('#help:before').css({ 
    "width" : windowWidth - xOffset, 
    "height" : windowHeight - yOffset 
}); 

CSS 파일을

#help { opacity: 0.9; filter:alpha(opacity=90); -moz-opacity: 0.9; z-index: 1000000; bottom: -550px; left: 400px; background-color: #808080; border: 5px dashed #494949; -webkit-border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px; } #help:before { border: 5px solid white; content: ''; position: absolute; -webkit-border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px; } 

Answer 1

jQuery를 통해 직접 수행 할 수 없습니다. 이 질문에

봐 :

내가 가 JS에서 스타일 시트를 조작하기위한 유효한 사용 사례 거기 생각하기 때문에 내가 함께 small library for this을 던졌다 : Setting CSS pseudo-class rules from JavaScript

@Box9's answer은 아마 당신이 실제로 사용해야 하나입니다 .

Answer 2

.css()을 사용하여 너비와 높이를 설정하는 대신 .width() 및 height()을 직접 사용해야합니다.