93 lines
2.9 KiB
JavaScript
93 lines
2.9 KiB
JavaScript
var images = []
|
|
images.push("images/widescreen_landscape_wallpaper_63195_poster2000.jpg");
|
|
images.push("images/6877519-mountain-landscape-wallpaper.jpg");
|
|
images.push("images/tropical-landscape-wallpaper.jpg");
|
|
images.push("images/new-york%20landscape%20wallpaper86478.jpg");
|
|
images.push("images/Beautiful%20city%20landscape%20wallpapers%20960x800%20(07).jpg");
|
|
images.push("images/beautiful_night_landscape-1024x768.jpg");
|
|
images.push("images/trees%20stars%20artwork%20night%20landscapes%20night%20sky%201920x1080%20wallpaper_www.wall321.com_26.jpg");
|
|
images.push("images/Buildings_Street_Night_Lights-Urban_Landscape_Wallpaper_medium.jpg");
|
|
images.push("images/1QOCyDJ.jpg");
|
|
|
|
|
|
var imageButton = [images.length];
|
|
for (i = 0; i < images.length; i++)
|
|
{
|
|
imageButton[i] = document.createElement('button');
|
|
imageButton[i].type = "button";
|
|
imageButton[i].className = 'btn btn-info btn-lg thumbnail';
|
|
imageButton.title = images[i];
|
|
}
|
|
|
|
function main() {
|
|
|
|
var galleryView = document.getElementById('usrPicGallery');
|
|
var galleryView1 = document.createElement('div');
|
|
galleryView1.id = "galleyView";
|
|
loadGallery(galleryView1);
|
|
galleryView.insertBefore(galleryView1, galleryView.childNodes[0]);
|
|
|
|
loadSlide();
|
|
|
|
loadPaginationButtons();
|
|
}
|
|
function loadGallery(galleryView1)
|
|
{
|
|
|
|
for(i=0;i<images.length;i++)
|
|
{
|
|
var column = document.createElement('div');
|
|
column.className = "col-md-3";
|
|
var imagePic = document.createElement('img');
|
|
imagePic.src = images[i];
|
|
imagePic.style.width = '150px';
|
|
imagePic.style.height = '150px';
|
|
|
|
imageButton[i].appendChild(imagePic);
|
|
column.appendChild(imageButton[i]);
|
|
galleryView1.appendChild(column);
|
|
}
|
|
}
|
|
function loadSlide()
|
|
{
|
|
var slideInner = document.getElementById('carouselInner');
|
|
for (i = 0; i < images.length; i++)
|
|
{
|
|
var slideImgDiv = document.createElement('div');
|
|
if (i === 0) {
|
|
slideImgDiv.className = "item active";
|
|
}
|
|
else {
|
|
slideImgDiv.className = "item";
|
|
}
|
|
|
|
var slideImg = document.createElement('img');
|
|
slideImg.src = images[i];
|
|
slideImg.style.width = "820px";
|
|
slideImg.style.height = "480px";
|
|
slideImgDiv.appendChild(slideImg);
|
|
slideInner.appendChild(slideImgDiv);
|
|
}
|
|
|
|
}
|
|
|
|
function loadPaginationButtons()
|
|
{
|
|
var album = document.getElementById('album');
|
|
var pagination = document.createElement('ul');
|
|
pagination.className='pagination';
|
|
var paginationBtns=[2];
|
|
for(i=0;i<2;i++)
|
|
{
|
|
var pagLink = document.createElement('a');
|
|
paginationBtns[i] = document.createElement('li');
|
|
if (i === 0)
|
|
paginationBtns[i].className = 'active';
|
|
|
|
pagLink.href = "#";
|
|
paginationBtns[i].appendChild(pageLink);
|
|
pagination.appendChild(paginationBtns[i]);
|
|
}
|
|
album.appendChild(pagination);
|
|
}
|