css속성값 조건문 채택완료

7년 전 조회 4,612

latest스킨 for문이 아래와 같습니다. 

Copy
<ul class="bjqs">
    <?php for ($i=0; $i<count($list); $i++) {
        $j = $i + 1;
    ?>
        <li>  
        <div class="mention1"></div>
        <div class="mention2"></div>
        <div class="mention3"></div>
        </li>
    <?php } ?>
</ul>

하려는 것은

ul.bjqs 이 left 속성값이 로딩되면서 -1100px,

그리고 -2200px; -3300px; 다시 -1100px... 이런식으로 반복되는 방식의 스킨인데요,

 

ul.bjqs의 left속성값의 변화에 따라

mention1,2,3중 하나만 안보이게 하려고

아래와 같이 jQuery를 했는데 

문제는 로딩시에 left값이 -1100px이어서 첫번째 적용되고 

이후 바뀌는 left값을 캐치를 못하고 있는데 무슨 방법이 없을까요?

Copy
$(document).ready(function(){

 if($("ul.bjqs").css('left')=="-1100px"){ 
  $(".mention1").hide("fast");  
 }else{
  $(".mention1").show("fast"); 
 }
 
 if($("ul.bjqs").css('left')=="-2200px"){ 
  $(".mention2").hide("fast");  
 }else{
  $(".mention2").show("fast"); 
 }
 
 if($("ul.bjqs").css('left')=="-3300px"){ 
  $(".mention3").hide("fast");  
 }else{
  $(".mention3").show("fast"); 
 } 
 
});

답변 3개

채택된 답변
+20 포인트
 <div class="mention1"></div>
 <div class="mention2"></div>
 <div class="mention3"></div>

어떤타입인지 정확히 모르지만 위 3개가 로드되나요?

1,2,3을 그냥 <?php echo $i;?>로 바꾸시고 1개 로드 3개 출력으로 해보심이 어떨까요

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

네 3개 동시에 로드되고 나서 ul.bjqs 의 left 속성이 바뀌는것에 따라 하나씩 가릴려는 겁니다.
ul.bjqs 의 left값은 딱 3개 뿐이구요.^^
한번밖에 로딩이 안되니깐 로딩된후 바뀌는 값을 감지해야할것 같은데... 한참 찾고만 있네요~ㅎ
감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

Copy
<script>
$(document).ready(function(){

if($("ul.bjqs").css('left')=="-1100px").change(function(){
    
    $(".mention1").css('display')=="none"); 

}

});
</script>

 이렇게도 해봤는데 안되네요. 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

bjqs 의 left 속성이 어떻게 바뀌게 되어 있나요?

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

아래처럼 슬라이드의 width값 만큼 바뀝니다. width 1100px입니다.
[code]
$slider.animate({'left': -state.nextindex * state.slidewidth }, settings.animduration, function(){

state.currentslide = state.nextslide;
state.currentindex = state.nextindex;

// is the current slide a clone?
if($slides.eq(state.currentindex).attr('data-clone') === 'last'){

// affirmative, at the last slide (clone of first)
$slider.css({'left': -state.slidewidth });
state.currentslide = 2;
state.currentindex = 1;

}
else if($slides.eq(state.currentindex).attr('data-clone') === 'first'){

// affirmative, at the fist slide (clone of last)
$slider.css({'left': -state.slidewidth *(state.slidecount - 2)});
state.currentslide = state.slidecount - 1;
state.currentindex = state.slidecount - 2;

}

state.animating = false;

});
[/code]
if(slider.eq(state.currentindex).attr('data-clone') === 'last'){
// 1
} else if(slider.eq(state.currentindex).attr('data-clone') === 'first'){
// 2
} else {
// 3
}

해당 플러그인을 몰라서 테스트는 못해봤지만
1,2,3 각 부분에 show, hide 를 추가하면 어떨까 싶네요

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고