제이쿼리 질문합니다.
본문
스크롤 내릴 시에 border에 linear-gradient 속성을 추가하고 싶습니다.
<script>
$(document).ready(function(){
$(window).scroll(function(){
var scroll = $(window).scrollTop();
if (scroll > 0) {
$("#hd").css("background" , "#fff");
$("#hd").css("border-width" , "4px");
$("#hd").css("border-style" , "solid");
$("#hd").css("border-imager" , "linearGradient(to right, #c0d940, #00a3e4)");
$("#hd").css("border-right" , "none");
$("#hd").css("border-left" , "none");
$("#hd").css("border-top" , "none");
}
else{
$("#hd").css("background" , "none");
}
})
})
</script>
linearGradient 속성이 안 먹어서 검정색 boder가 출력이 되는데 해결할 수 있는 방법이 없을까요?
답변 1
<script>
$(document).ready(function(){
$(window).scroll(function(){
var scroll = $(window).scrollTop();
if (scroll > 0) {
$("#hd").addClass('on');
}
else{
$("#hd").removeClass('on');
}
})
})
</script>
이런식으로 클래스를 주고, CSS에서 처리하는게 더 편하실거같습니다.
오 감사합니다!