배즐

vezzle.co.kr에 사용된 JS

$(document).ready(function () {

  vezzle = {
	mobileSize: 767,
    init: function () {
    	vezzle.menuopen();
    	vezzle.mobilemenu();
    	vezzle.topfix();
    },
    /* 메뉴 활성화 */
    menuopen: function () {
		if(typeof depth !== "undefined") {
			var $nav = $(".gnb").find(".menu");
		  	$.each($nav.find("a"), function(index, item) {
		  		var _item = $(this).attr("data-menu");
		  		var _depth = _item.split("_");
		  		var _depthShift = _depth.shift();
		  		
		  		if(_depth.join("") === depth.join("")) {
		  			$(this).addClass("active").parents("ul").siblings("a").addClass("active");
		  			return false;
		  		}
		  	});
		  	
		  	var $nav_mobile = $(".gnb").find(".mobile_menu");
		  	$.each($nav_mobile.find("a"), function(index, item) {
		  		var _item = $(this).attr("data-menu");
		  		var _depth = _item.split("_");
		  		var _depthShift = _depth.shift();
		  		if(_depth.join("") === depth.join("")) {		  			
		  			$(this).addClass("active");
		  			return false;
		  		}
		  	});
		}
    },
    /* 모바일 메뉴 */
    mobilemenu: function () {
    	var $gnb_open = $(".gnb_open");
    	var $gnb_clear = $(".gnb_clear");
    	var $gnb_close = $(".gnb_close");
    	var $nav = $(".gnb").find(".menu");
    	var $document_width = $(document).width();
    	var fired = [];

    	$(window).on('resize', function () {
    	  if ($(this).width() <= vezzle.mobileSize && !fired[0]) {
    	    fired[0] = true;
    	    fired[1] = false;
    	    
    	    $gnb_open.on("click", function() {
        		var _document_height = $(document).height()
        		$gnb_clear.addClass("active");
        		$gnb_clear.height(_document_height-75);
        	});
        	$gnb_close.on("click", function() {
        		$gnb_clear.removeClass("active");
        		$gnb_clear.height("");
        	});
        	
    		$nav.find(">li >a").on("click", function(e){
    			if($(this).hasClass("no_link")) {
    				e.preventDefault();
    				
    				if(!$(this).siblings("ul").is(":visible")) {
    					$nav.find(">li ul").slideUp(100);
        				$(this).siblings("ul").slideDown(100);
    				}
    			}
    		});
    	  }
    	  else if ($(this).width() > vezzle.mobileSize && !fired[1]) {
    	    fired[0] = false;
    	    fired[1] = true;
    	    
    	    $gnb_clear.height("");
    	    $nav.find(">li >ul").removeAttr("style");
    	    $nav.find(">li >a").off();
    	  }
    	}).trigger('resize');
    },
    /* 탑 고정 */
    topfix: function () {
    	var disScroll;
        var scrollInterval;
        var $gnb = $(".gnb");
        var $gnb_clear = $(".gnb_clear");
        var $swiper_menu = $(".swiper-container-menu");
        
        $(document).on('scroll', function(){
        	scrollDone();
        }).trigger("scroll");
        function scrollDone() {
        	var $document_width = $(document).width();
        	var sct = $(window).scrollTop();
        	if(sct >= 69) {
        		if($document_width > vezzle.mobileSize) {
        			$gnb.addClass("fix");
        		} else {
        			$swiper_menu.addClass("fix");
        		}
        		$("body").addClass("fixpadding");
        	} else {
        		$gnb.removeClass("fix")
        		$swiper_menu.removeClass("fix");
        		$("body").removeClass("fixpadding");
        	}
        }
    },
  }
  
 
  vezzle.init();
});

메인에 별로도 사용한 소스

var $joy_titure = $(".joy_titure");
var _joy_titure_index = $joy_titure.find(".target:first-child >div").length;
var _joy_titure_randum = Math.floor(Math.random() * _joy_titure_index) + 1;
$joy_titure.find(".target:first-child >div").eq(_joy_titure_randum).addClass("active");

var tag = document.createElement('script');
var joy_titure_video = ["mezVoXBeOts", "g4FAQYYUUdk", "2z9BqlG6-aE", "8w7iZEdiL5E","JcVwFpJErqo","XgDUqGGu-Xk","F76lLOM-2fU","wXhJAIln1Hw","e2b6shsn1WE","jfMG8YGlVsI","qfSTVNLaM2c","zYFJ6t5CHD0","IZ1mgIZUOfc","9IYNDJJqxIM", "FuSqgbNX7Gs"];

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var player;
function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        videoId: joy_titure_video[_joy_titure_randum],
        events: {
            'onReady': onPlayerReady,
            'onStateChange': function (event) {
                if (event.data == YT.PlayerState.ENDED) {
                    event.target.stopVideo();
                }
            }
        }
    });
}
function onPlayerReady(event) {
    event.target.setVolume(0);
}


    var swiper = new Swiper('.swiper-container', {
      slidesPerView: _slidesPer,
      spaceBetween: 30,
      observer: true,
      observeParents: true,
      //centeredSlides: true,
      navigation : {
          nextEl : '.button-next',
          prevEl : '.button-prev',
      },
    });
    
    $(".joy2_list .swiper-slide a").on("click", function(e) {
        e.preventDefault();
        
        var $joy_titure = $(".joy_titure");
        var _this_novideo = $(this).attr("class");
        if(_this_novideo === "no_video") {
        	$joy_titure.find(".right").hide();
        } else {
        	$joy_titure.find(".right").show();
        }
        
        var _list_data = $(this).attr("data-video");
        
        var $document_width = $(document).width();
        if ($document_width >= 767) {
        	 player.loadVideoById(_list_data, 0, "default");
        }
       

        var _tepth_1 = $(this).parents(".active").index();
        var _tepth_2 = $(this).parent().index();
        
        $joy_titure.find(">div >div").removeClass("active");
        $joy_titure.find(">div").eq(_tepth_1).find(">div").eq(_tepth_2).addClass("active");
    });