특정 페이지에서 css를 변경하는 스크립트?
본문
<script>
window.onload = function() {
document.getElementById('hide').style.display = 'none';
}
</script>
안녕하세요, 위 코드를 활용해서 특정 페이지에서만 css를 다르게 적용하려고하는데, .css()를 넣으니 잘 작동하지 않습니다. absolute top 60인 요소를 top 0으로 만든다고 쳤을때,
<script>
window.onload = function() {
document.getElementById('(아이디)').css({
'top : 0 !important;'
})
}
</script>
이렇게 하는게 아닌걸까요?
답변 5
css에서 position: absolute;는 relative로 되어야 합니다.
<script>
window.onload = function() {
var element = document.getElementById('idid');
element.style.setProperty('top', '0px', 'important');
}
</script>
안녕하세요, 답변 감사합니다.
작동은 잘 되고있으나 여전히 그.. 잔상처럼 원래 top 60한게 그 위치에 남아있습니다 ㅠ
그래서 top 0 된 요소와 top 60인 요소 2개가 있는 것처럼 보입니다.. (top 0로 된 요소는 개발자 콘솔로도 안집힙니다. 위에 사진 보신거 참고해주시면 감사하겠습니다..)
<script>
window.onload = function() {
var element = document.getElementById('idid');
element.style.setProperty('top', '0px', 'important');
element.style.setProperty('position', 'relative');
}
</script>
해 보시고 안되시면 주소나 코드가 더 필요하겠습니다.
앗 해결됐습니다!!! ㅠㅠ 너무 감사합니다
채택 감사 합니다.
<script>
$(function() {
$('#아이디').css('top', '0 !important');
});
</script>
해당 방법이 작동하지 않아서 window.onload로 사용하고있었습니다 ㅠ
document.getElementById('(아이디)').style.height = '0';
height로 높이를 조정한게 아니여서... window.onload를 사용하는 방식으로 가르쳐주시면 감사하겠습니다 ㅠㅠ
변경원하는 부분 css입니다...
position: absolute;
top: 60px; << 여기를 0으로 바꾸고자합니다
right: 0;
height: 40px;
line-height: 40px;
text-align: right;
color: #666666;
font-size: 12px;
<script>
window.onload = function() {
document.getElementById('(아이디)').style.height = '0';
}
</script>
document.getElementById('(아이디)') 를 $("#아이디") 로 바꿔보세요.
덧글에는 사진 넣을수가 없어서 위에 단 댓글 봐주심 감사합니다!
아이디명 앞에 #을 붙이면 작동이 안되어서 (실제로 아이디명에 괄호를 붙인게 아니고 그냥 아이디명만 써넣은 상태였습니다) 그냥 아이디만 넣고 작동시켰을 땐 요소가 2개가 보이는 현상이 나타납니다..
ZDS님 JavaScript에 사용하여 CSS 속성을 변경할 때는 스타일 객체를 사용해야합니다.
즉 .css() 메서드는 jQuery에서 사용되는 메서드이므로 스크립트 에서는 사용할 수 없어요.
<script>
window.onload = function() {
var element = document.getElementById('(아이디)');
element.style.position = 'absolute';
element.style.top = '0px';
}
</script>
이렇게 해보세요
