Questions tagged [elastislide]

Elastislide is a responsive image carousel that will adapt fluidly in a layout. It is a jQuery plugin that can be laid out horizontally or vertically with a pre-defined minimum number of shown images.

With the responsive awakening in web design it becomes important to not only take care of the visual part of a website but also of the functionality.

Elastislide is a responsive jQuery image carousel that will adapt its size and its behavior in order to work on any screen size. Inserting the carousel’s structure into a container with a fluid width will also make the carousel fluid.

In a carousel, one could think that simply making its container “shorter” will solve the problem on smaller screens, but in some cases (e.g. when we have bigger images) it might be reasonable to resize the items as well. This and other options are part of Elastislide’s properties.

Elastislide uses the jQuery++ for the swipe events on touch devices.

Source: Tympanus.net (Elastislide)

14 questions
5
votes
1 answer

Elastislide - how to make it work with varying image widths

I am using Elastislide for an image slider for a site I'm working on (http://tympanus.net/codrops/2011/09/12/elastislide-responsive-carousel/). Love the plug in and it works well in this responsive site (I've modified it to only slide one image at a…
Adz
  • 51
  • 4
1
vote
0 answers

Tympanus Elastislide : main image sliding animation

I am using tympanus Elastislide Carousel Responsive jQuery plugin for my website. The plugin works perfectly on my site. But, I want to add animation on main image sliding left to right. plugin link :…
Keval Mehta
  • 689
  • 3
  • 28
1
vote
0 answers

How can I implement Elastislide (content-box) in a Bootstrap 3.3.5 (border-box) project?

I have trouble implementing an Elastislide Image Gallery with Bootstrap 3. The Elastislide HTML, CSS and JQuery code I'm using is here: http://bit.ly/1o01x3x. I'm working with Bootstrap tutorials and examples from W3Schools: http://bit.ly/1sJZYs4. I…
1
vote
1 answer

Elastislide jQuery Plugin Error

http://tympanus.net/codrops/2011/09/12/elastislide-responsive-carousel/ The plugin is not loading on my page at all, here's what I've done: Uploaded all .js files to server and called in head section AFTER the jQuery lib uploaded and linked all…
user3399141
  • 11
  • 1
  • 2
1
vote
1 answer

Jquery - Elastislide stop sliding when mouse overing

I'm using ELASTISLIDE – A RESPONSIVE JQUERY CAROUSEL PLUGIN The plugin works perfectly on my site. but i need to stop sliding when mouseover Below code for autoplay sliding // autoplay true || false autoplay : true, and if(this.options.autoplay…
Shammel
  • 33
  • 5
1
vote
0 answers

some elastislide images fail to load in IE9

I'm using 2 elastisliders on a web page and everything works fine in firefox, chrome, safari, ie8 and 10 but in ie9 some images fail to load. The images which are failing to load are random (a page refresh results in different images failing to…
Paul
  • 11
  • 2
1
vote
2 answers

How to dynamically add images and a link to a carousel?

I would like to understand how this works. The jQuery carousel I would like to use is Elastislide. http://tympanus.net/codrops/2011/09/12/elastislide-responsive-carousel/ The site gives us the code we need to use : var carousel =…
Kris
  • 133
  • 1
  • 2
  • 6
0
votes
1 answer

How to Add AutoSlide effect to a specific image gallery?

I am new to jquery and i need help with an image gallery.I have choosen to use the gallery https://tympanus.net/Tutorials/ResponsiveImageGallery/ and what i want to do is to add the option of Auto slide for that gallery.The code is here :…
krisi
  • 3
  • 7
0
votes
1 answer

How to reinitialize Elastislide carousel with a new image set - using angularjs

I am using angularjs and would like to show/hide a carousel on a page. Based on events on the page, I would like to remove and later display the carousel again with a distinct set of images. The following directive works to initially load the…
s_t_e_v_e
  • 2,496
  • 3
  • 31
  • 35
0
votes
1 answer

how to change the number of visible items in Elastislide vertical carousel

i'm using Elastislide vertical carousel from here http://tympanus.net/codrops/2012/10/29/elastislide-revised/ and this is the vertical one http://tympanus.net/Development/Elastislide/index2.html I've changed the height of the carousel and the…
jq beginner
  • 1,010
  • 3
  • 21
  • 41
0
votes
1 answer

Multiple elastislide viewers on single page

I need to have multiple elastislide viewers on my webpage, but I can't for the life of me get them to work... I tried using the example of a solved similar question on here, but it still wont work. If anyone could show me some code, or a real…
b f
  • 1
  • 1
0
votes
2 answers

elastislide move one at a time

I'd like to move one image at a time with the elastislide plugin put can't figure it out. I read on the plugin comments that you can change line 295 from this: var amount = this.fitCount * this.itemW, val; to this: var amount = this.itemW; but the…
JohnThomas
  • 273
  • 1
  • 2
  • 10
0
votes
1 answer

Elastislide carousel cached images

I got some problem with elastislide.js.. When my browser cache is empty (for chrome,firefox and safari), and all of my website is loading, the elastislide is working fine and show my items. However, when I reload the page, the items are cached, they…
Glou94
  • 37
  • 8
-1
votes
3 answers

adding hyperlinks in a jquery gallery description area

I'm using a jQuery plug-in called Elastislide which can be seen here: http://tympanus.net/codrops/2011/09/20/responsive-image-gallery/ The problem I'm having is I'm trying to insert a hyperlink into the gallery image description area but it doesn't…