테스트 사이트 - 개발 중인 베타 버전입니다

게시물 홀수번/짝수번 다른 class 적용 채택완료

이미님 5년 전 조회 4,095

 

 

그림처럼 홀수번째 게시물(1로 표시한 박스)은 클래스 SL을, 짝수번째 게시물(2로 표시한 박스)은 클래스 SR을 추가 적용하고자 합니다. 다른 분들이 올리신 질문들을 참고해서 

 

</p>

<p><div class="timeline-content <?php if($i%2==0){ ?>js--fadeInLeft<?php }else{ ?>js--fadeInRight<?php }?>"></p>

<p>

 

이렇게 써봤는데요, 딱 하나만 클래스가 다르게 먹히더라고요.

하나만 되는게 아니라 1:3으로 먹히는 것 같아요.

왜...일까, 라고 하면 당연히 코드를 잘못 써서겠죠.... 어느 부분이 문제일까요? 도움 바랍니다.

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

답변 3개

채택된 답변
+20 포인트
a
5년 전

https://sir.kr/g4_tiptech/33043">https://sir.kr/g4_tiptech/33043 팁을 응용하면 되지 않을까요..

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

답변에 대한 댓글 1개

이미님
5년 전
와...!! 거의 포기 상태였는데 알려주신 코드를 고쳐서 적용하니 98%까지 해결이 됐습니다!! 고맙습니다^^

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

d
5년 전

i 변수가 잘못 증가하는게 원인일 것 같습니다만..

아래처럼 해보세요.

.timeline-content:nth-child(odd){js--fadeInLeft 스타일}

.timeline-content:nth-child(even) {js--fadeInRight 스타일}

 

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

답변에 대한 댓글 1개

이미님
5년 전
css에 추가할 수 있는게 아니라서...
스크립트에서 쓰려고 넣는 클래스라서요 ㅠㅠ
음... 그 부분을 고쳐봐야겠네요.
도움 감사합니다!

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

5년 전

해당 소스는 잘못된 점이 없어보이네요, 번갈아가면서 값을 다르게 하는것이 의도하는 바이고 해당 소스는 나머지가 0일때와 1일때 두가지 경우이므로 일반적인 for문(1씩 증가하는)이라면 정상동작해야 맞습니다. i값이 for문안에서 변하거나, i값이 1증가가 아닌 2나 3처럼 다르게 증가한다거나, 또는 i가 for문의 변수가 아니거나 아니면 외부적인 문제로 css자체가 문제가 있다거나 하는것으로 보입니다. 알려주신 정보가 부족하기에 정확하게 답변 드릴 수 없네요

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

답변에 대한 댓글 1개

이미님
5년 전
게시물은 제대로 나오는데 class가 죽어라 1:3 비율로 나오니 속이 터집니다. 다른 분 올려주신 스킨의 코드도 참고해서 고쳐봤는데 결과값에 변화가 없고요.. 도움 감사합니다. 좀더 찾아봐야겠어요 ㅠㅠ

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

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

로그인