https://www.tabaknee.nl/templates/skelet/js/universal/custom.js

1(function($) {
2 "use strict";
3
4$(document).ready(function() {
5
6	
7	$("#owl-demo").owlCarousel({
8	autoPlay: 3000,
9	items : 4,
10	itemsDesktop : [1170,3],
11	itemsDesktopSmall : [1170,3]
12	});
13	
14	$("#owl-demo2").owlCarousel({
15	autoPlay : 5000,
16	stopOnHover : true,
17	navigation: false,
18	paginationSpeed : 1000,
19	goToFirstSpeed : 2000,
20	singleItem : true,
21	autoHeight : true,
22	transitionStyle:"fade"
23	});
24	
25	$("#owl-demo3").owlCarousel({
26	autoPlay : 5000,
27	stopOnHover : true,
28	navigation: false,
29	paginationSpeed : 1000,
30	goToFirstSpeed : 2000,
31	singleItem : true,
32	autoHeight : true,
33	transitionStyle:"fadeUp"
34	});
35	
36	$("#owl-demo4").owlCarousel({
37	autoPlay : 5000,
38	stopOnHover : true,
39	navigation: false,
40	paginationSpeed : 1000,
41	goToFirstSpeed : 2000,
42	singleItem : true,
43	autoHeight : true,
44	transitionStyle:"goDown"
45	});
46	
47	$("#owl-demo5").owlCarousel({
48	autoPlay : 8000,
49	stopOnHover : true,
50	navigation: false,
51	paginationSpeed : 1000,
52	goToFirstSpeed : 2000,
53	singleItem : true,
54	autoHeight : true,
55	transitionStyle:"goDown"
56	});
57	
58	$("#owl-demo6").owlCarousel({
59	autoPlay : 5000,
60	stopOnHover : true,
61	navigation: false,
62	paginationSpeed : 1000,
63	goToFirstSpeed : 2000,
64	singleItem : true,
65	autoHeight : true,
66	transitionStyle:"fadeUp"
67	});
68	
69	$("#owl-demo7").owlCarousel({
70	items : 4,
71	lazyLoad : true,
72	navigation : true,
73	pagination:false,
74	});
75	
76	$("#owl-demo8").owlCarousel({
77	autoPlay : 5000,
78	stopOnHover : true,
79	singleItem : true,
80	paginationSpeed : 1000,
81	goToFirstSpeed : 2000,
82	transitionStyle:"fade"
83  	});
84
85	$("#owl-demo10").owlCarousel({
86	autoPlay : 8000,
87	stopOnHover : true,
88	navigation: false,
89	paginationSpeed : 1000,
90	goToFirstSpeed : 2000,
91	singleItem : true,
92	autoHeight : true,
93	transitionStyle:"backSlide"
94  	});
95	
96	$("#owl-demo11").owlCarousel({
97	autoPlay : 5000,
98	stopOnHover : true,
99	navigation: false,
100	paginationSpeed : 1000,
101	goToFirstSpeed : 2000,
102	singleItem : true,
103	autoHeight : true,
104	transitionStyle:"backSlide"
105	});
106	
107	
108  var time = 7; // time in seconds
109
110  var $progressBar,
111	  $bar, 
112	  $elem, 
113	  isPause, 
114	  tick,
115	  percentTime;
116
117	//Init the carousel
118	$("#owl-demo9").owlCarousel({
119	  slideSpeed : 500,
120	  navigation: true,
121	  paginationSpeed : 500,
122	  singleItem : true,
123	  afterInit : progressBar,
124	  afterMove : moved,
125	  startDragging : pauseOnDragging
126	});
127
128	//Init progressBar where elem is $("#owl-demo")
129	function progressBar(elem){
130	  $elem = elem;
131	  //build progress bar elements
132	  buildProgressBar();
133	  //start counting
134	  start();
135	}
136
137	//create div#progressBar and div#bar then prepend to $("#owl-demo")
138	function buildProgressBar(){
139	  $progressBar = $("<div>",{
140		id:"progressBar"
141	  });
142	  $bar = $("<div>",{
143		id:"bar"
144	  });
145	  $progressBar.append($bar).prependTo($elem);
146	}
147
148	function start() {
149	  //reset timer
150	  percentTime = 0;
151	  isPause = false;
152	  //run interval every 0.01 second
153	  tick = setInterval(interval, 10);
154	};
155
156	function interval() {
157	  if(isPause === false){
158		percentTime += 1 / time;
159		$bar.css({
160		   width: percentTime+"%"
161		 });
162		//if percentTime is equal or greater than 100
163		if(percentTime >= 100){
164		  //slide to next item 
165		  $elem.trigger('owl.next')
166		}
167	  }
168	}
169
170	//pause while dragging 
171	function pauseOnDragging(){
172	  isPause = true;
173	}
174
175	//moved callback
176	function moved(){
177	  //clear interval
178	  clearTimeout(tick);
179	  //start again
180	  start();
181	}
182
183	
184	
185	var sync1 = $("#sync1");
186	var sync2 = $("#sync2");
187	
188	sync1.owlCarousel({
189	singleItem : true,
190	slideSpeed : 1000,
191	pagination:false,
192	afterAction : syncPosition,
193	responsiveRefreshRate : 200,
194	});
195	
196	sync2.owlCarousel({
197	items : 5,
198	itemsDesktop      : [1170,5],
199	itemsDesktopSmall     : [979,5],
200	itemsTablet       : [768,3],
201	itemsMobile       : [479,3],
202	pagination:false,
203	responsiveRefreshRate : 100,
204	afterInit : function(el){
205	  el.find(".owl-item").eq(0).addClass("synced");
206	}
207	});
208	
209	function syncPosition(el){
210	var current = this.currentItem;
211	$("#sync2")
212	  .find(".owl-item")
213	  .removeClass("synced")
214	  .eq(current)
215	  .addClass("synced")
216	if($("#sync2").data("owlCarousel") !== undefined){
217	  center(current)
218	}
219	
220	}
221	
222	$("#sync2").on("click", ".owl-item", function(e){

223	e.preventDefault();
224	var number = $(this).data("owlItem");
225	sync1.trigger("owl.goTo",number);
226	});
227	
228	function center(number){
229	var sync2visible = sync2.data("owlCarousel").owl.visibleItems;
230	
231	var num = number;
232	var found = false;
233	for(var i in sync2visible){
234	  if(num === sync2visible[i]){
235		var found = true;
236	  }
237	}
238	
239	if(found===false){
240	  if(num>sync2visible[sync2visible.length-1]){
241		sync2.trigger("owl.goTo", num - sync2visible.length+2)
242	  }else{
243		if(num - 1 === -1){
244		  num = 0;
245		}
246		sync2.trigger("owl.goTo", num);
247	  }
248	} else if(num === sync2visible[sync2visible.length-1]){
249	  sync2.trigger("owl.goTo", sync2visible[1])
250	} else if(num === sync2visible[0]){
251	  sync2.trigger("owl.goTo", num-1)
252	}
253	}
254	
255
256
257	$("#colosebut1").click(function(){
258	$("#div1").fadeOut("slow");
259	});
260	$("#colosebut2").click(function(){
261	$("#div2").fadeOut("slow");
262	});
263	$("#colosebut3").click(function(){
264	$("#div3").fadeOut("slow");
265	});
266	$("#colosebut4").click(function(){
267	$("#div4").fadeOut("slow");
268	});
269
270
271
272	$('#fixed').darkTooltip({
273		gravity:'north'
274	});
275
276	$('#def').darkTooltip();
277
278	$('#def-html').darkTooltip({
279		opacity:1,
280		gravity:'west'
281	});
282	
283	$('#def-html2').darkTooltip({
284		opacity:1,
285		gravity:'south'
286	});
287	
288	$('#def-html3').darkTooltip({
289		opacity:1,
290		gravity:'north'
291	});
292	
293	$('#def-html4').darkTooltip({
294		opacity:1,
295		gravity:'east'
296	});
297	
298	$('#click-me').darkTooltip({
299		trigger:'click',
300		animation:'flipIn',
301		gravity:'west'
302	});
303
304	$('#confirm').darkTooltip({
305		trigger:'click',
306		animation:'flipIn',
307		gravity:'west',
308		confirm:true,
309		yes:'Sure',
310		no:'No Way',
311		finalMessage: 'It has been deleted'
312	});
313
314	$('#modal').darkTooltip({
315		trigger:'click',
316		animation:'flipIn',
317		gravity:'west',
318		modal: true,
319		theme:'light'
320	});
321
322	$('#confirm-light').darkTooltip({
323		trigger:'click',
324		animation:'flipIn',
325		gravity:'west',
326		confirm:true,
327		theme:'light',
328		onYes: function(){
329			alert("This is a custom event for 'Yes' option");
330		},
331		onNo: function(){
332			alert("This is a custom event for 'No' option");
333		}
334	});
335
336	$('#small-s').darkTooltip({
337		size:'small',
338		gravity: 'south'
339	});
340	$('#medium-s').darkTooltip({
341		gravity: 'south'
342	});
343	$('#large-s').darkTooltip({
344		size:'large',
345		gravity: 'south'
346	});
347
348	$('#south').darkTooltip({
349		gravity: 'south'
350	});
351	$('#west').darkTooltip({
352		gravity: 'west'
353	});
354	$('#north').darkTooltip({
355		gravity: 'north'
356	});
357	$('#east').darkTooltip({
358		gravity: 'east'
359	});
360
361
362	$('#effect-none').darkTooltip();
363	$('#effect-flipin').darkTooltip({
364		animation:'flipIn'
365	});
366	$('#effect-fadein').darkTooltip({
367		animation:'fadeIn'
368	});
369
370	$('#theme-dark').darkTooltip();
371	$('#theme-light').darkTooltip({
372		theme:'light'
373	});
374
375	
376	
377
378	
379	
380	
381});	
382	
383})(jQuery);