218 lines
3.7 KiB
JavaScript
Executable File
218 lines
3.7 KiB
JavaScript
Executable File
var currentOffset = 0;
|
|
var viewHeight, displayable, galleryHeight, galleryMargin, galleryCount, maxOffset;
|
|
|
|
$(function () {
|
|
//$("body").backstretch("img/backgrounds/bg_restaurant.jpg");
|
|
lightbox.option({
|
|
'resizeDuration': 300,
|
|
'wrapAround': true,
|
|
'albumLabel': "Bild %1 von %2"
|
|
});
|
|
|
|
function init() {
|
|
viewHeight = $(window).height();
|
|
displayable = Math.floor((viewHeight - 220) / 140);
|
|
galleryHeight = displayable * 140;
|
|
galleryMargin = (viewHeight - galleryHeight) / 2;
|
|
galleryCount = $('#navi li').length;
|
|
maxOffset = -1 * (galleryCount - displayable) * 140;
|
|
console.debug(displayable, galleryCount);
|
|
|
|
$('#scroll').css({
|
|
height: galleryHeight,
|
|
'top': galleryMargin
|
|
})
|
|
}
|
|
|
|
let imagesToLoad = [{
|
|
path: "Restaurant01",
|
|
alt: "nice"
|
|
},
|
|
{
|
|
path: "Restaurant02",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant31",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant34",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant05",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant11",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant13",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant14",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant07",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant08",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant48",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant17",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant19",
|
|
alt: "Der Blick auf das Foyer aus unserer oberen Etage"
|
|
},
|
|
{
|
|
path: "Restaurant20",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant23",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant25",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant40",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Restaurant49",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen01",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen22",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen21",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen23",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen24",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen25",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Speisen26",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Buffet01",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Buffet02",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Buffet04",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Buffet06",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Buffet07",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Buffet11",
|
|
alt: ""
|
|
},
|
|
{
|
|
path: "Zubereitung01",
|
|
alt: "So geht es in der Küche zu"
|
|
},
|
|
{
|
|
path: "Zubereitung02",
|
|
alt: "So geht es in der Küche zu"
|
|
},
|
|
{
|
|
path: "Zubereitung03",
|
|
alt: "So geht es in der Küche zu"
|
|
},
|
|
{
|
|
path: "Zubereitung04",
|
|
alt: "So geht es in der Küche zu"
|
|
}
|
|
]
|
|
imagesToLoad.sort(function () {
|
|
return Math.random() - 0.5;
|
|
})
|
|
imagesToLoad.forEach(function (element) {
|
|
var item = '<li><a href="img/gallery/' +
|
|
element.path +
|
|
'.jpg" title="" data-lightbox="' +
|
|
'album' //element.path.substr(0, 4)
|
|
+
|
|
'" style="background-image: url(img/gallery/thumb/' +
|
|
element.path +
|
|
'.jpg);" data-alt="' +
|
|
element.alt +
|
|
'" data-title="' +
|
|
element.alt +
|
|
'"></a></li>';
|
|
$('#navi').append(item);
|
|
});
|
|
|
|
$('#prev').click(function () {
|
|
if (currentOffset < 0) {
|
|
currentOffset += 140;
|
|
} else {
|
|
currentOffset = maxOffset;
|
|
}
|
|
$('#navi').css('transform', "translateY(" + currentOffset + "px)");
|
|
});
|
|
|
|
$('#next').click(function () {
|
|
|
|
if (currentOffset > maxOffset) {
|
|
currentOffset -= 140;
|
|
} else {
|
|
currentOffset = 0;
|
|
}
|
|
$('#navi').css('transform', "translateY(" + currentOffset + "px)");
|
|
});
|
|
|
|
|
|
$(window).on('mousewheel DOMMouseScroll', function (event) {
|
|
if (event.originalEvent.detail >= 0) {
|
|
$('#next').click();
|
|
} else {
|
|
$('#prev').click();
|
|
}
|
|
});
|
|
$(window).resize(function () {
|
|
init();
|
|
});
|
|
init();
|
|
}); |