C
C
Christina2017-12-09 01:09:27
JavaScript
Christina, 2017-12-09 01:09:27

How to make a slider with a vertical thumbnail bar to the right of the big image?

How to make a slider with a vertical thumbnail bar to the right of the big image?
Sorry, I can't find a link to an example.
What plugins are suitable?
Thank you!

Answer the question

In order to leave comments, you need to log in

3 answer(s)
V
Vadim Bogomazov, 2019-09-26
@lexstile

The js stack implementation is Googled in half a minute.
It remains to tweak a little.

function Stack() {
    this._size = 0;
    this._storage = {};
}
 
Stack.prototype.push = function(data) {
    var size = ++this._size;
    this._storage[size] = data;
};
 
Stack.prototype.pop = function() {
    var size = this._size,
        deletedData;
 
    if (size) {
        deletedData = this._storage[size];
 
        delete this._storage[size];
        this._size--;
 
        return deletedData;
    }
};

class Stack {
  constructor() {
    this.stack = []
  }
  
  // Inserts the element into the top of the stack
  push(element) {
    this.stack.push(element)
  }
  
  // Removes the element from the top of the stack and return that element
  pop() {
    if (this.isEmpty()) return 'Stack is empty!'
    return this.stack.pop()
  }
  
  // Return which element is on top of the stack
  peek() {
    if (this.isEmpty()) return 'Stack is empty'
    return this.stack[this.stack.length - 1]
  }
  
  // helper method
  isEmpty() {
    return !this.stack.length
  }
}

M
modernwebdev, 2017-12-09
@KrisIris

kenwheeler.github.io/slick see here Slider Syncing and for thumbnails add vertical:true in settings

F
FalseCode, 2017-12-09
@FalseCode

https://owlcarousel2.github.io/OwlCarousel2/ have a look at this one. There may be a problem in a slick if the page structure is complex.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question