https://www.conpak.com.hk/js/conpak.hknav.min.js?v=7

1(function (window, document) {
2	 var cp_header   = document.querySelector('.cp-main-header'),
3       	 cp_menu     = document.querySelector('.cp-primary-nav'),
4         cp_menuLink = document.querySelector('.cp-nav-trigger')
5		 cp_main     = document.querySelector('.cp-main-content'),
6		 cp_footer   = document.querySelector('.cp-footer'),
7		 cp_searchLink=document.querySelector('.cp-search-trigger'),
8		 cp_search   = document.querySelector('.cp-search'),
9		 cp_body     = document.body,
10		 cp_width	 =1024,
11		 cp_overlay  = document.querySelector('.cp-overlay'),
12		 cp_lang_list =document.querySelector('.lang-list'),
13		 cp_submenu  = document.querySelector('.cp-menu');
14	     //彈出菜單
15	     cp_menuLink.onclick =function (e) {
16		 if(event.preventDefault){event.preventDefault();}
17		 else{event.returnValue = false;}
18		 if(hasClass(cp_main,"nav-is-visible"))
19		 {
20			closeNav();
21			removeClass(cp_overlay,'is-visible');
22			removeClass(cp_submenu,'cp-menu-show');
23			$(".cp-dropmenu").removeClass("cp-menu-show");
24       			$("i.i-active").removeClass("i-active");
25			$(".open-menu-show").prev().find("i").first().addClass("i-active");
26			$(".cp-mobile-chat").show();
27	        }
28		else
29		{
30			addClass(this,'nav-is-visible');
31			addClass(cp_menu,'nav-is-visible');
32			addClass(cp_header,'nav-is-visible');
33			addClass(cp_main,'nav-is-visible');
34			addClass(cp_footer,'nav-is-visible');
35			addClass(cp_submenu,'cp-menu-show');
36			 $(".open-menu-show").addClass("cp-menu-show");
37			var transitionEvent = whichTransitionEvent();
38			transitionEvent && cp_footer.addEventListener(transitionEvent, function() {
39				addClass(cp_body,'overflow-hidden');
40			});	
41			$(".cp-mobile-chat").hide();
42			toggleSearch('close');
43			addClass(cp_overlay,'is-visible'); 
44			}
45		  }
46	function closeNav()
47	{
48		removeClass(cp_menuLink,"nav-is-visible");
49		removeClass(cp_header,"nav-is-visible");
50		removeClass(cp_menu,"nav-is-visible");
51		removeClass(cp_main,"nav-is-visible");
52		removeClass(cp_footer,"nav-is-visible");
53		var transitionEvent = whichTransitionEvent();
54			transitionEvent && cp_footer.addEventListener(transitionEvent, function() {
55				removeClass(cp_body,'overflow-hidden');
56			});	 
57		//$("meta[name='viewport']").attr('content','width=device-width, initial-scale=1,user-scalable=1;')
58		}
59	//搜索
60	cp_searchLink.onclick =function (e) {
61		 if(event.preventDefault){event.preventDefault();}
62		 else{event.returnValue = false;}
63		toggleSearch();
64		closeNav();
65	}
66	function toggleSearch(type) {
67		if(type=="close") {
68			removeClass(cp_search,'is-visible');
69			removeClass(cp_searchLink,'search-is-visible');
70			removeClass(cp_overlay,'search-is-visible');
71		} else {
72			//toggle search visibility
73			toggleClass(cp_search,'is-visible');
74			toggleClass(cp_searchLink,'search-is-visible');
75		    toggleClass(cp_overlay,'search-is-visible');
76			if(document.body.clientWidth < cp_width && hasClass(cp_search,'is-visible'))
77			{
78				 document.querySelector('#keyword').focus();
79			}
80			(hasClass(cp_search,'is-visible')) ? addClass(cp_overlay,'is-visible'):removeClass(cp_overlay,'is-visible');
81		}
82	}
83	//submenu
84	function hasClass(el,className)
85	{	if (el.classList){return el.classList.contains(className);}
86		else{return new RegExp('(^| )' + className + '( |$)', 'gi').test(el.className);}
87	}
88	function addClass(el,className)
89	{
90		if (el.classList){el.classList.add(className);}
91		else{el.className += ' ' + className;}
92	}
93	function removeClass(el,className)
94	{
95		if (el.classList){el.classList.remove(className);}
96		else{el.className = el.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');}
97	}
98	function toggleClass(el,className)
99	{
100		if (el.classList) {el.classList.toggle(className);} 
101		else {
102			  var classes = el.className.split(' ');
103			  var existingIndex = classes.indexOf(className);
104			  if (existingIndex >= 0)
105				classes.splice(existingIndex, 1);
106			  else
107				classes.push(className); el.className = classes.join(' ');
108		}
109	}
110	//動畫完成
111	function whichTransitionEvent(){
112			    var t;
113			    var el = document.createElement('conpakelement');
114			    var transitions = {
115			      'transition':'transitionend',
116			      'OTransition':'oTransitionEnd',
117			      'MozTransition':'transitionend',
118			      'WebkitTransition':'webkitTransitionEnd'
119			    }
120
121			    for(t in transitions){
122			        if( el.style[t] !== undefined ){
123			            return transitions[t];
124			        }
125			    }
126			}		 
127}(this, this.document));
128$(function(){
129	$(window).on('resize', function(){
130		checkWindowWidth();
131	});
132	function isPC(){  
133           var userAgentInfo = navigator.userAgent;  
134           var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");  
135           var flag = true;  
136           for (var v = 0; v < Agents.length; v++) {  
137               if (userAgentInfo.indexOf(Agents[v]) > 0) { flag = false; break; }  
138           }  
139           return flag;  
140       } 
141	$('.cp-menu').children('.has-children').children('a').on('click', function(event){
142		if(!checkWindowWidth())
143		{event.preventDefault();
144		var selected = $(this);
145		if(selected.next('div').hasClass('cp-dropmenu'))
146		{
147			selected.parent().siblings().children('div.cp-dropmenu').removeClass('cp-menu-show');
148			selected.parent().siblings('.has-children').children('a').children('i').removeClass('i-active');
149			selected.parent().siblings('.has-children').find(".open-menu-show").removeClass("cp-menu-show");
150			selected.next('div').toggleClass('cp-menu-show');
151			//selected.next('div').css('height',$(window).height());
152			selected.children('i').first().toggleClass('i-active');
153			$("#m7,#m8").removeClass("m-hasbg");
154			
155			}
156		}
157		else
158		{
159			if(!isPC())
160			{
161				event.preventDefault();
162				$(this).parent().siblings().children('div.cp-dropmenu').hide();
163				$(this).parent().siblings().removeClass('cp-ipad-menu');
164				$(this).next('div').toggle();
165				$(this).parent().toggleClass('cp-ipad-menu');
166			}
167		}
168	});
169	if(!isPC()){
170		var curName=($("body").attr("id"));
171		switch (curName){
172			case "cpm-services":
173				ShowCurrenti($("#m2"));
174				break;
175			case "cpm-about":
176				ShowCurrenti($("#m3"));
177				break;
178			case "cpm-pub":
179				ShowCurrenti($("#m4"));
180				break;
181			case "cpm-faq":
182				ShowCurrenti($("#m5"));
183				break;
184			case "cpm-contact":
185				ShowCurrenti($("#m6"));
186				break;
187			case "cpm-job":
188				$("#m7").addClass("m-hasbg");
189				break;
190			case "cpm-subscribe":
191				$("#m8").addClass("m-hasbg");
192				break;
193			
194		}
195	}
196	function ShowCurrenti($e)
197		{
198			$e.find("i").first().addClass("i-active");
199			$e.find(".cp-dropmenu").addClass("open-menu-show");
200		}
201	if(!isPC())
202	{
203		$(".cp-wch").click(function(){
204			$('.cp-top-qr').toggle();
205			});
206		$("#cp-other-lang").click(function(){
207			$('#cp-all-lang').toggle();
208			$(this).toggleClass('cp-arrow-top');
209			})
210	}
211    $(".cp-nav-trigger").click(function () {
212        $(".lang-list").children("ul").hasClass("mobile-lang") || ($(".lang-list").append('<ul class="mobile-lang"><li><i class="cp-hk"></i>繁</li><li><a href="javascript:ChangeEn()"><i class="cp-eng"></i>Eng</a></li><li><a href="javascript:ChangeCn()"><i class="cp-cn"></i>简</a></li><li><a href="javascript:ChangeJa()"><i class="cp-ja"></i>日</a></li></ul>'));
213    })
214	//$('.cp-mobile-lang').click(function(){
215	//var langHtml='<ul class="mobile-lang"><li class="cp-m-back hidden-cp"><a href="javascript:void(0);">返回</a></li><li><a href="javascript:ChangeEn()"><i class="cp-eng"></i>English</a></li><li><a href="javascript:ChangeCn()"><i class="cp-cn"></i>简体<i class="icon-checkmark icon-right"></i></a></li><li><a href="javascript:ChangeJa()"><i class="cp-ja"></i>日本語</a></li><li><a href="javascript:ChangeHk()"><i class="cp-hk"></i>繁體</a></li></ul>';
216	//	if(!$('.lang-list').children('ul').hasClass('mobile-lang'))
217	//	{$('.lang-list').append(langHtml);
218	//	  $(".cp-m-back").click(function(){
219	//		  if($(this).parent().parent().parent().hasClass('cp-dropmenu'))
220	//			{
221	//			$(this).parent().parent().parent().removeClass('cp-menu-show');
222	//			}
223	//			else
224	//			{$(this).parent().parent().removeClass('cp-menu-show');
225	//				}
226	//			$(this).parent().parent().parent().parent().find('i').removeClass('i-active');
227	//		  })
228	//		}
229	//	})
230	$('.cp-menu-back').on('click', function(event){
231		if($(this).parent().parent().parent().parent().hasClass('cp-dropmenu'))
232		{
233		$(this).parent().parent().parent().parent().removeClass('cp-menu-show');
234		}
235		else
236		{$(this).parent().parent().parent().removeClass('cp-menu-show');
237			}
238		$(this).parent().parent().parent().parent().parent().find('i').removeClass('i-active');
239	});
240	$('.has-subli').children('a').on('click', function(event){
241		if(!checkWindowWidth())
242		{event.preventDefault();}
243		var haveclass=$(this).next('ul').hasClass('cp-sub-show');
244		$('.has-subli>ul').removeClass('cp-sub-show');
245		if(haveclass)
246		{
247		$(this).next('ul').addClass('cp-sub-show');
248		}
249		$(this).next('ul').toggleClass('cp-sub-show');
250	});
251
252	function checkWindowWidth() {
253		var e = window, 
254		a = 'inner';
255		if (!('innerWidth' in window )) {
256		a = 'client';
257		e = document.documentElement || document.body;
258			}
259		if ( e[ a+'Width' ] >= cp_width ) {return true;} 
260		else {return false;}
261	}
262})