js 좌우 단 추 를 누 르 면 사진 효 과 를 인 스 턴 스 로 재생 합 니 다.

1598 단어
본 고 는 js 가 좌우 단 추 를 누 르 면 사진 효 과 를 번갈아 방송 하 는 방법 을 실례 로 서술 하 였 다.모두 에 게 참고 하도록 공유 하 다.구체 적 인 실현 방법 은 다음 과 같다.

$(function () { 
  var index = 1; 
  var pPage = 1; 
  var $v_citemss = $(".citemss"); 
  var $v_show = $v_citemss.find("ul"); 
  v_width = $v_citemss.width();//       div    
 
  // :    ,      var,      underfine 
  p_count = $v_citemss.find("li").length;//    li    
  $(".slideprev1").click(function () { 
    if (!$v_show.is(":animated")) { 
      if (pPage == index) { 
        $v_show.animate({ right: '0px' }, "3000"); 
        pPage = 4; 
      } else { 
        $v_show.animate({right: '-=' + v_width },"3000"); 
        pPage--; 
      } 
    } 
  }); 
 
  $(".slidenext").click(function () { 
    if (!$v_show.is(":animated")) { 
      if (pPage == p_count) { 
        $v_show.animate({ left: '0px' }, "3000"); 
        pPage = 1; 
      } else { 
        $v_show.animate({ left: '-=' + v_width }, "3000"); 
        pPage++; 
      } 
    } 
  }); 
});

마우스 가 떠 오 르 면 아래 에 가로줄 설명, 좌우 버튼 등 효과 가 나타 나 css 로 충분히 실현 할 수 있 으 며 js 를 사용 하지 않 아 도 됩 니 다.
구체 적 인 조작: css 에서 절대 또는 상대 적 인 포 지 셔 닝, left, right 또는 bottom 은 마이너스 이 고 마우스 가 떠 오 른 후에 각각 정확하게 표시 하고 transition 을 설정 하여 애니메이션 의 버퍼 로 사용 하면 됩 니 다.
본 논문 에서 말 한 것 이 여러분 의 자바 script 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.

좋은 웹페이지 즐겨찾기