• 목록

1) css

.sub-mb-sub-ul-link-loading {position: absolute;top:0;left:0;width: 100%;height: 100%;background:rgba(0, 0, 0, 0.7);z-index: 9999;display:none;}

@keyframes sub-link-spinner {

	from {transform: rotate(0deg); }

	to {transform: rotate(360deg);}

}1)

.sub-mb-sub-ul-link-loading .sub-link-spinner {

box-sizing: border-box;position: absolute;top: 50%;left: 50%;width: 64px;height: 64px;margin-top: -32px;margin-left: -32px;border-radius: 50%;

border: 8px solid transparent;border-top-color: #f19022;border-bottom-color: #f19022;animation: sub-link-spinner .8s ease infinite;}

2)html

<div class="sub-mb-sub-ul-link-loading"><div class="sub-link-spinner"></div></div>

3) javascript

// 2차 메뉴 클릭시 진동

$(document).on('click', '.ul-mobile-list .mb-sub-ul .li-sub-ul a', function(e){

	var linkStr = $.trim( $(this).attr('href') );

	cmaCallVibrate(100);// 진동 수행 1000 = 1초, 100 : 0.1초가 적당


	if(linkStr == '#' || linkStr == '#none') {

		//

	} else {

		// 로딩 spinner

		$('.mobile_menu_small_login').css('visibility', 'hidden');

		$('.common_mobile_menu_close').css('visibility', 'hidden');

		$('.sub-mb-sub-ul-link-loading').show();


		$('body').css({'overflow':'hidden', 'pointer-events':'none', 'touch-action':'none'});

	}

});

추천 0 비추천 0