메가박스 사이트 따라 만들기 - 영화 차트 탭

megabox09

영화 차트 탭 메뉴

버튼을 클릭하면 해당 컨텐츠에 연결되게 합니다.

그림자 효과

글자에 그림자를 넣을 때는 text-shadow를 사용함

결과

js

//영화차트 탭 메뉴
var movBtn = $(".movie_title > ul > li");
var movCont = $(".movie_chart > div");

movCont.hide().eq(0).show();

movBtn.click(function (e) {
  e.preventDefault();
  var target = $(this);
  var index = target.index();
  movBtn.removeClass("active");
  target.addClass("active");
  movCont.css("display", "none");
  movCont.eq(index).css("display", "block");
});

 

출력