[이런 저런 이야기] 제이쿼리 질문드려요

전체화면에 이미지가 깔리는 구조입니다

배경이 흰색일때는 로고 메뉴가 잘보이는데

배경이 검정색으로 바뀌면 로고 메뉴가 안보여서요 ;;

박스슬라이더 플러그인으로 배경 이미지가 바뀌게 만들었거든요

슬라이드가 바뀔때(검정색으로) 헤더에 클래스를 추가하는 제이쿼리가 가능할까요?

인터넷 검색해봤더니

           

 

            <div data-anchor="page1">

              <h1>이미지</h1>

            </div>

            <div data-anchor="page2">

              <h1>이미지</h1>

            </div>            

           

 

이런식으로 앵커를 넣고

 

화면에 앵커가(page2) 보여질때 헤더에 클래스를 넣어주는 제이쿼리가 가능할까요?

[키로즈]

어떤 슬라이드 쓰는지 알아야하고요. 슬라이드 api 보면 슬라이드 변할때마다 콜백함수 선언하는 부분이 있을꺼 같네요

[김포 잉여인간]

http://bxslider.com/ 해외사이트 플러그인 이에요

슬라이드 변할때마다 콜백함수라는게 있으면 제가 원하는것이 가능한건가용?

[키로즈]

onSlideAfter
Executes immediately after each slide transition. Function argument is the current slide element (when transition completes).
default: function(){}
options: function($slideElement, oldIndex, newIndex){ // your code here }
arguments:
$slideElement: jQuery element of the destination element
oldIndex: element index of the previous slide (before the transition)
newIndex: element index of the destination slide (after the transition)

[키로즈]

http://bxslider.com/examples/callback-api 여기 쓰는법 나오는데요 힌트를 주면

onSlideAfter : function(a,b,c) {
$(".header").removeClass("blackBg");
if (c == 1 ) { $(".header").addClass("blackBg");

}

[키로즈]

이런식으로 하면 되겠네요

[김포 잉여인간]

귀한 시간 내주셔서 감사합니다^^ 알려주신 내용 참고해서 노력해볼게요! 감사합니다 좋은 하루 보내세용 ^^

[김포 잉여인간]

<s-cript>
jQuery_bs_01('.bxslider').bxSlider({
mode: 'fade',
auto: true,
controls: false,
onSlideAfter : function(a,b,c) {
$(".header").removeClass("blackBg");
if (c - 2 == 1) { $(".header").addClass("blackBg");}
if (c == 1) { $(".header").addClass("blackBg");}
},
useCSS: false
});
<//s!crip/>