Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- if (!Object.create) {
- Object.create = function (obj) {
- function f() { };
- f.prototype = obj;
- return new f();
- }
- }
- var Image = {
- init: function (title, thumbnailUrl, largeUrl) {
- this.title = title;
- this.thumbnailUrl = thumbnailUrl;
- this.largeUrl = largeUrl;
- }
- };
- var slider = (function () {
- var currentIndex = 0;
- var bigSlider = document.getElementById("big");
- var images = [];
- function add(image) {
- images.push(image);
- }
- function render() {
- var privBtn = document.getElementById("privBtn");
- privBtn.addEventListener("click", privBtnClick, false);
- var nextBtn = document.getElementById("nextBtn");
- nextBtn.addEventListener("click", nextBtnClick, false);
- bigSlider.setAttribute("src", images[0].largeUrl);
- var cont = document.getElementById("cont");
- cont.addEventListener("click", onClick, false);
- var documentFragmen = document.createDocumentFragment();
- for (index in images) {
- var img = document.createElement("img");
- img.setAttribute("src", images[index].thumbnailUrl);
- documentFragmen.appendChild(img);
- }
- cont.appendChild(documentFragmen);
- }
- function onClick(ev) {
- var elem = ev.target;
- var counter = 0;
- while(elem.previousElementSibling){
- counter++;
- elem = elem.previousElementSibling;
- }
- currentIndex = counter;
- bigSlider.setAttribute("src", images[currentIndex].largeUrl);
- //var urlArr = url.split("/");
- //var index = urlArr[urlArr.length - 1].substring(0, 1);
- //bigSlider = document.getElementById("big");
- //bigSlider.setAttribute("src", "image/" + index + "big.jpg")
- }
- function privBtnClick() {
- //var index = bigSlider.getAttribute("src").split("/")[1][0] | 0;
- currentIndex--;
- if (currentIndex < 0) {
- currentIndex = images.length - 1;
- }
- bigSlider.setAttribute("src", images[currentIndex].largeUrl);
- }
- function nextBtnClick() {
- //var index = bigSlider.getAttribute("src").split("/")[1][0] | 0;
- currentIndex++;
- if (currentIndex === images.length) {
- currentIndex = 0;
- }
- bigSlider.setAttribute("src", images[currentIndex].largeUrl);
- }
- return {
- add: add,
- render: render
- }
- }());
- var img1 = Object.create(Image);
- img1.init("first", "image/1small.jpg", "image/1big.jpg");
- slider.add(img1);
- var img2 = Object.create(Image);
- img2.init("second", "image/2small.jpg", "image/2big.jpg");
- console.log(img2);
- slider.add(img2);
- var img3 = Object.create(Image);
- img3.init("third", "image/3small.jpg", "image/3big.jpg");
- slider.add(img3);
- var img4 = Object.create(Image);
- img4.init("fourth", "image/4small.jpg", "image/4big.jpg");
- slider.add(img4);
- var img5 = Object.create(Image);
- img5.init("fifth", "image/5small.jpg", "image/5big.jpg");
- slider.add(img5);
- slider.render();
Advertisement
Add Comment
Please, Sign In to add comment