This website uses cookies to personalise ads and to analyse traffic ok
web design

jQuery thumbnail scroller

Changelog

  • Aug 5, 2015
    • Updated plugin to version 2.0.3
    • Fixed issue: https://github.com/malihu/thumbnail-scroller/issues/5 regarding Chrome browser on Android.
    • Minor optimizations on auto-update function.
  • Apr 2, 2015
    • Updated plugin to version 2.0.2
    • Fixed a bug that prevented onInit callback triggering on elements that didn’t require scrolling.
  • Dec 3, 2014
    • Updated plugin to version 2.0.1
    • Updated/fixed various script private functions.
  • Oct 17, 2014
    • Updated plugin to version 2.0.0
    • Plugin script completely re-written to support multiple selector types, option parameters and methods.
    • Removed jQuery UI dependency (plugin does not require jQuery UI anymore).
    • Extended scroller types and related options (speed, axis etc.).
    • Optimized all js animation tweens for better performance.
    • Added support for touch-enabled devices.
    • Added some advanced parameters for auto-updating the scroller on element and content resize (fixed all related issues).
    • Added user defined custom callback functions.
    • Added the following methods: update, scrollTo, stop, disable, destroy
    • Plugin license changed from GPL/L-GPL to MIT.
  • Oct 8, 2011
    • Changed anchors css display property to block and added float:left; (instead of display:inline-block;) to avoid extra whitespace between thumbnails.
  • May 30, 2011
    • Plugin is greatly upgraded by the addition of new features and updated to be conflict-proof with other js libraries and scripts by changing css class names, thumbnailScroller function calling, jquery.thumbnailScroller.js and by adding jQuery.noConflict();.
    • Added 2 more scrolling types (3 total): an additional scrolling via mouse movement and a new scrolling type via next/previous buttons. The 3 types of scroller are: “hoverPrecise”, “hoverAccelerate” and “clickButtons”.
    • Added auto-scrolling feature.
  • Feb 23, 2011
    • Automatically setting content width for horizontal scrollers is no longer calculated via javascript. Instead of using jQuery .each() or for statements, the width is now set by adding an additional div (.horWrapper) that wraps content and by setting the display of .container div to inline, thus expanding its width automatically (check the updated css file for details).
  • Jan 1, 2011
    • Modified the plugin to scroll images with different widths horizontally.
  • Nov 29, 2010
    • Created a plugin out of the original script for easy implementation, configuration and multiple scrollers on a single page.
    • Minor code fixes and enhancements.
  • Nov 26, 2010
  • Oct 18, 2010
    • Brad Mace added some code to increase the left and right margins of the thumbnail scroller in order to be easier to get the first and last thumbnails all the way on the screen, without having to move the mouse to the very edge. Script updated πŸ™‚ thanks Brad!

Plugin home

 

Pages: 1 2 3


743 Comments

Post a comment

Comments pages: 1 12 13 14

  1. Maulik Patel
    Posted on June 8, 2017 at 15:34 Permalink

    Harsh Prajapati

    Reply
  2. kaji
    Posted on February 7, 2017 at 08:53 Permalink

    Can we stop scrolling on mouse click or hover wherever we need.

    Reply
  3. Ameen Shan
    Posted on February 6, 2017 at 21:02 Permalink

    Hi,
    Great plugin,Working perfectley ,
    Is it possible to add multi[le scrolling methord for a single id.

    like both click and hover
    $(“#my-thumbs-list”).mThumbnailScroller({
    axis:”y” ,//change to “y” for vertical scroller,
    type:”hover-50″,
    contentTouchScroll :50
    });

    $(“#my-thumbs-list”).mThumbnailScroller({
    axis:”y” ,//change to “y” for vertical scroller,
    type:”click-50″,

    });

    Reply
  4. Alex
    Posted on December 5, 2016 at 20:48 Permalink

    .mTS_horizontal .mTSContainer { margin-left: auto !important; margin-right: auto !important; }

    Reply
  5. Alex
    Posted on August 16, 2016 at 06:49 Permalink

    Malihu, thank you for such a great js plugin!

    I have only a small issue: can’t center thumbnails if their overall width is less than of the container. So they are aligned to the left.

    If I’m not blind (don’t see in config section) and such feature is not implemented in this version of the plugin, I’m requesting such feature in new releases! πŸ™‚

    Yes, this can be achived with callbacks-counting-offset, but it becomes complicated.

    What do You think, Malihu?

    Reply
  6. Hills
    Posted on August 10, 2016 at 08:22 Permalink

    hi Thanks for this great Job!
    I want to scroll a grid box of 15 list items and display 9 list items first and 6 list item… when scroll is activated.
    Can u help me please

    Reply
  7. sap netweaver training in hyderabad
    Posted on August 1, 2016 at 15:25 Permalink
  8. Hyginus
    Posted on June 28, 2016 at 07:33 Permalink

    Hi this is a great script for me. please could you explain how I can get this to work on desktop using hover and same time on Mobile using touch

    Reply
    • malihu
      Posted on June 28, 2016 at 09:33 Permalink

      The plugin works with regular mouse and touch (you don’t have to do anything). In touch devices you just touch swipe thumbnails. Do you have a particular issue with a device?

      Reply
      • Ashish
        Posted on August 2, 2016 at 12:30 Permalink

        The scroller goes on infinite scroll on touch devices. It won’t stop at the end of the list but keep on scrolling white no any elements inside, just white background.

        Reply
  9. Alek
    Posted on June 8, 2016 at 15:41 Permalink

    Hi!
    Great plugin!

    Have a question about optimalization. When I use a multilevel thumbnails grid to move entire website from left to right there is a problem with smothness. There’s little of shaking. When I use 32gb ram, i7 pc its works fine but in regular pc’s there is a problem with that. Have any suggestion?:)

    Regards,
    Alek

    Reply
  10. Daan
    Posted on April 21, 2016 at 23:01 Permalink

    If wanted to initially scroll to the middle of thumbnail (or other) content, how would i do that? element.scrollLeft(n) doesnt seem to work and seems to be overwritten?

    My div is 5000 px wide and i want to initially show it @ 2500 px.

    Reply
  11. Marc
    Posted on April 11, 2016 at 13:30 Permalink

    Hi, thanks for this great script.

    But I have a question: Is it possible, that the images are continuing scrolling while holding down the mouse button over the arrows instead of clicking the button?

    Reply
  12. Marcin
    Posted on March 1, 2016 at 10:51 Permalink

    Hi,
    how to turn on infinitve scrolling?

    Reply
  13. Nadir Latif
    Posted on February 11, 2016 at 14:40 Permalink

    Excellent plugin. It works well. I used it to implement horizontal scrolling playlist for JWPlayer 7. See screenshot: http://pakjiddat.com/wp-content/uploads/2016/02/jwplayer-integration-750×410.png.

    Thanks for your plugin.

    Regards,
    Nadir Latif

    Reply

Comments pages: 1 12 13 14

Post a comment

Your e-mail is never published nor shared. Required fields are marked *

You may use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>
You can write or copy/paste code directly in your comment using the <code> tag:
<code>code here...</code>
You may also use the data-lang attribute to determine the code language like so:
<code data-lang-html>, <code data-lang-css>, <code data-lang-js> and <code data-lang-php>

css.php