You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
parallel-library/html/js/main.js

108 lines
3.4 KiB
JavaScript

This file contains invisible Unicode characters!

This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.

$(window).load(function(){
//initialize background slideshow
if(!$('body').hasClass("no-bg-slides")){
$.vegas('slideshow', {
delay: 50000,
backgrounds:[
{ src:'images/slide01.jpg', fade: 1000 },
{ src:'images/slide02.jpg', fade: 1000 },
{ src:'images/slide03.jpg', fade: 1000 },
{ src:'images/slide04.jpg', fade: 1000 }
]
})();
}
});
$(function() {
//toggle the slideshow mode
$('#gallery-swap').click(function(event) {
if ($('body').hasClass('slideshow')){
$('body').removeClass('slideshow');
} else {
$('body').addClass('slideshow');
}
});
//slideshow naviagaion
$('.slide-nav li').click(function(event) {
if ($(this).hasClass('next')) {
$.vegas('next');
} else {
$.vegas('previous');
}
});
$('nav li a').click(function(event) {
$(this).parents('ul').find('li').removeClass('active');
$(this).parent('li').addClass('active');
});
//keyboard navigation for slideshow.
//left, right, esc
$(window).keydown(function(event) {
if($('body').hasClass('slideshow')) {
if(event.keyCode==37){
$.vegas('previous');
}
if(event.keyCode==39){
$.vegas('next');
}
if(event.keyCode==27){
$('body').removeClass('slideshow');
}
}
});
$('#open-menu').click(function(){
$('nav').toggleClass('open');
$('body').toggleClass('open');
});
$('header').swipe({
swipe: function(event, direction, distance, duration, fingers){
// console.log(direction, distance, event, duration);
if(direction=="right"){
$('nav').addClass('open');
$('body').addClass('open');
}
if(direction=="left"){
$('nav').removeClass('open');
$('body').removeClass('open');
}
}
});
$('.magnific').magnificPopup({
type: 'image',
mainClass: 'mfp-with-zoom',
gallery: {
enabled: true,
tCounter: '<span class="mfp-counter">%curr%/%total%</span>',
arrowMarkup: '<button title="%title%" type="button" class="entypo slide-button chevron-thin-%dir%"></button>'
//arrowMarkup: '<span class="entypo slide-button chevron-thin-%dir%"></span>'
//<span class="entypo chevron-thin-left"></span>
},
zoom: {
enabled: true, // By default it's false, so don't forget to enable it
duration: 300, // duration of the effect, in milliseconds
easing: 'ease-in-out', // CSS transition easing function
// The "opener" function should return the element from which popup will be zoomed in
// and to which popup will be scaled down
// By defailt it looks for an image tag:
opener: function(openerElement) {
// openerElement is the element on which popup was initialized, in this case its <a> tag
// you don't need to add "opener" option if this code matches your needs, it's defailt one.
return openerElement.is('img') ? openerElement : openerElement.find('img');
}
}
});
});