posted on:January 26, 2009

Easy Slider 15 The Easiest jQuery Plugin For Sliding Images and Content


Click here for the new version of this plugin

Version 1.5 of my Easy Slider plugin for jQuery is here. This is one of the my rare scripts that make it to their second version.
All of the features here are result of your comments, so if you have more ideas, keep ‘em coming!

Note: in case you haven’t already, you might want to check out article about first version of this plugin.

Download easySlider1.5.zip

Features

This version features:

  • auto slide
  • continuous sliding
  • "go to first" and "go to last" button
  • hiding controls
  • optional wrapping markup for control buttons
  • vertical sliding
  • multiple sliders on one page

Here are the things you can customize (with their default values)

prevId: 'prevBtn',
prevText: 'Previous',
nextId: 'nextBtn',	
nextText: 'Next',
controlsShow: true,
controlsBefore: '',
controlsAfter: '',	
controlsFade: true,
firstId: 'firstBtn',
firstText: 'First',
firstShow: false,
lastId: 'lastBtn',	
lastText: 'Last',
lastShow: false,				
vertical: false,
speed: 800,
auto: false,
pause: 2000,
continuous: false

I will explain new options:

controlsShow

By default set to true, but if set to false it will not add any controls. It can be used with auto scroll when you want to disable user interaction.

controlsBefore and controlsAfter

In case you want to add some additional markup to gain more control over buttons you can do so by using these parameters. Check out the demo where I use these options.

controlsFade

By default set to true. If set to false it will disable button hiding when slider reaches the end.

firstShow and lastShow

These parameters hide (or show) "go to first" and "go to last" buttons

auto

This option enables auto sliding, Just set it to true.

pause

This option is set in milliseconds and it represent the duration of each slide when plugin is set to auto sliding

continuous

If set to true clicking the next button when the slider reached the end will jump to the beginning (and vice-versa). Combining this option with auto (both set to true) you’ll get endless animation

Demos

I have prepared 5 demos, although I could have done zillions. Hopefully I will have the time to create more good demos as I continue to develop this plugin

Future

I already have some ideas about next versions (play/pause buttons, numbered pagination…) but I would also like you to share any idea you might have.

Enjoyed the article?

Then don't miss our next one! Subscribe to our RSS feed or share it with your friends.

DeliciousStumbleUpon RedditSubscribe

Comments (308 Comments)

  1. Sérgio Soaes
    January 26, 2009

    good job :) very beautiful sliders cheers
  2. Erick
    January 26, 2009

    Awesome plugin!! great job. Tested it and I'm really digging it. can't wait to use it on my live site!! superb work!
  3. sOledad arismendi
    January 26, 2009

    great script! and this version is even better! i was looking forward it the last days! thanks a lot!!!!!! you've done a great job!
  4. Khaled
    January 26, 2009

    that's cool! any hope to see multiple slides at one time? ie say you have a UL with 8 LI elements, can you show two at once and still skip forward / backward by 1 LI element at a time
  5. egohavoc
    January 26, 2009

    Just a question: I have a client that want's this scroller (excellent work btw) - But he wants 3 or 4 images shown at a time. I was wondering if there was a way to show more than one image and scroll one image to the left or right. Effectively, have 3 images. 1, 2, 3 are showing. Click "next" and image "1" leaves, revealing image "4", now showing images 2, 3, 4. I suppose I could "fake it" with HTML but i feel like this would be counter-productive. Thanks!
  6. cssglobe
    January 26, 2009

    ok, multiple slides (images) at the same time... Noted for future version.
  7. Michael
    January 26, 2009

    hi, really cool piece of code. just one feature request (or idea): it would be amazing that in continuous mode it would not scroll over all the slides in the middle and in the 'wrong' direction. you could just copy the last slide before the first, and the first after the last, so you have this smooth continuous scrolling, and then just jump to the real end or start in the background.
  8. Alen B.
    January 26, 2009

    mega. Outstanding job. Nice demos.
  9. alain
    January 27, 2009

    I second what Michael. It's kind of dizzying the ways it slides back to the first image. Nevertheless, it's a great piece of code and I applaud you!!
  10. Colin Scroggins
    January 27, 2009

    When using auto slide mode, if the user click on the previous or next links, the slides require manual navigation from that point forward. It would be nice if auto slide would resume in a user-determined amount of time as long as the mouse is not hovered over the slide or control links.
  11. Will Paccione
    January 27, 2009

    Nice! Gotta love jQuery! thanks!
  12. Belinda Clemesha
    January 27, 2009

    Thank you so much for the updated version, it's awesome! Appreciate all your efforts. Cheers.
  13. Victor
    January 27, 2009

    i definitely second the motion to implement numeric pagination. it would be cool if you could specify the shell div class and a child pagination class that has an attribute for the target page number.
  14. Nicolas Borda
    January 27, 2009

    I commented in the old post before knowing the updated version had already been posted. Again, I think this plugin is fantastic, thanks so much! The only problem I have with it is that if list items have nested divs or other elements, they're considered additional slides and you get empty slides in your slider. How can we solve this?
  15. Liam Morley
    January 27, 2009

    Not bad. I think it'd be nicer if going from the last frame to the first frame didn't take as long- perhaps if either this was sped up, or if the first frame followed after the last frame (maybe with a different type of visual cue to let know you you've gone full circle). Also, in Chrome, the 'prevBtn' image doesn't appear unless you click on it. Haven't tried in other browsers.
  16. David Hellmann
    January 27, 2009

    I use it and its really nice. thx for it!
  17. cssglobe
    January 27, 2009

    I will definitely have a fix for nested content. You can expect that soon, before next version comes out. I will post a fix here.
  18. Markus
    January 27, 2009

    nice plugin like it
  19. SSV
    January 27, 2009

    Nice plugin, i really enjoy it. Is it possible to link to slide number X in the controls? So, if i have 10 slides, the user can choose to go to slide #7 immediately instead of sliding trough the first six slides.
  20. Rob
    January 27, 2009

    Great work! I am trying to have both arrows left and right show like in this option "styled demo with default settings". I tried adding "controlsFade: false". Is there a way to have left and right arrows always appear? Thanks alot
  21. Jamie
    January 27, 2009

    Beautiful work! I can't wait to get the flash off my site and swap this for the current banner. Thanks!
  22. Odin Horthe Omdalt
    January 27, 2009

    I might use this on a Norwegian student newspaper. I've really liked the slider on http://whitehouse.gov/ But it's kinda crucial that autoslide stops when you hold your mouse over the content area. And, OK, it's called slider, but fading is also very nice ;-)
  23. David
    January 27, 2009

    I love you.
  24. Geoserv
    January 28, 2009

    STUMBLED! This is fantastic Thanks for sharing.
  25. Nathan Eshraghi
    January 28, 2009

    nice plugin, i especially like that it has a vertical option. My only question is does it have other navigation option. Rather than having next and previous and last, having like Home About and Contact. I haven't really taken a good look at it but does it have this functionality (ie like the codaslider).
  26. Fabio
    January 28, 2009

    awesome, i am about to launch my website and will surely make good use of it! there is only one feature that will make it 5 stars + instead of 5 stars, imho: is it possible to have in the first frame just the "next" button, without the "previous"? anyway, it is perfect even this way, many thanks
  27. Rich
    January 28, 2009

    I so needed this. thanks for sharing.
  28. E11World
    January 28, 2009

    Very very well done! I love this and can't wait to see future versions!
  29. fatherb
    January 28, 2009

    just phenomenal script. thanks very much. think it has been mentioned above, but any chance of having an option to have numbers in the main window so people can choose which screen to go to instead of the left and right buttons. and of course it would be nice if the rotation continued after a set time as it stops now once a button is pressed.
  30. WB
    January 28, 2009

    Great script. Quick question though...is it possible to have descriptive text directly under or part of each slide? I'd like to use this on my portfolio site to include my work followed by a description of that work.
  31. Max
    January 29, 2009

    Nice upgrade. One thing I notice: the prev button does not always appear when it should like it does in Firefox?
  32. joseph
    January 29, 2009

    Firefox 3.0.5 = no problem Opera 9.63 = no problem IE 7 = no problem Safari 3.2.1 = btn_next & btn_prev images dissapear Chrome 1.0.154.43 = btn_next & btn_prev images dissapear
  33. joseph
    January 29, 2009

    Flock 2.0.3 = no problem Netscape 9.0.0.6 (don't laugh:) = no problem
  34. Max
    January 29, 2009

    My favorite is the 02.html version. It adds the styling groundwork to create different nav button graphics. Very cool! But there is a definite issue here with Safari though: missing buttons. I have never tried using Chrome but it sounds like the same issue exits as well. Hopefully there will be a 1.5X fix to tweak this into shape?
  35. cssglobe
    January 29, 2009

    Thanks for the comments and suggestions guys! I will definitely have a look about Safari and Chrome issues and post the fixes here.
  36. ah66533
    January 29, 2009

    I am using IETester to test different IE versions.. IE6 -> works IE7 -> works IE8 (beta2) -> does not work With IE8 the main content is now changing. The main view is visible all the time. Buttons works just like they should (next button disappears at last slide). This might be IETester problem...
  37. dario-g
    January 29, 2009

    Great work. I'm think about using it on my site softio.pl but I decided to use different script becouse of lack events and slide selectors. If You decide to implement this functions I think about your script again :) Thanks for sharing
  38. Rich
    January 29, 2009

    How do you preload images when you ctrl+F5 on this example a few times you get the images down the page? http://cssglobe.com/lab/easyslider1.5/03.html
  39. Lluria
    January 29, 2009

    How can I wrap all the slide images so that in Dreamweaver's 'Design' section all the images do not appear under the first image. I just want the first image to be shown in dreamweaver? it kinda messes up the tables. If you know the solution please help.
  40. kesc
    January 29, 2009

    Works perfect in IE8 RC1.
  41. kuba
    January 29, 2009

    is any way I can create numbers or thumbnails below related to specific image instead using only arrows?
  42. Geoff
    January 30, 2009

    Hello Alen, Fantastic script, really really good, one question however is it possible for the animation rather than scrolling back to the initial image simply carry on..? so... [animation sequence scroll to start] 1 > 2 > 3> 4> 5> <scroll> 1 > 2 > 3> 4> 5<scroll> becomes.. [animation sequence no scroll] 1 > 2 > 3> 4> 5> 1 > 2 > 3> 4> 5> If so can anyone provide me to code? Regards Geoff.
  43. Rodney
    January 30, 2009

    Hi, Thanks a lot for the help again. Really digging this. just wanna pose another challenge to you and anyone else who can help..... can this plugin help in creating the slider navigation seen @ www.deviantart.com?
  44. Nicolas Borda
    January 30, 2009

    @cssglobe Hey just dropping back to see if there was any progress in the fix for nested item, I desperately need it. If you can give me a hint as to what needs to change I can give it a go over the weekend, I'm a beginner in jQuery but always willing to learn new stuff. Please let me know your plans as to when this will be fixed, and if its a priority. Thanks so much again for your awesome plugin, I'm ldoing a list on my favorite jQuery plugins and you can be sure this will be nearly at the top of the list! Cheers!
  45. Drew
    January 30, 2009

    I really like the new version of Easy Slider. Thanks for making a great plugin
  46. slickboyj
    January 30, 2009

    Can I use .png images with this script?
  47. Garrett
    January 31, 2009

    I am also having problems with safari and chrome. When I hit next it scrolls through all the items at once to the end of my list. On the other hand I have to say as well that this script is very impressive. Great job.
  48. psyhonut
    January 31, 2009

    http://pusku.info/portfolio/ - tnx for plugin.
  49. Michal
    February 2, 2009

    would it be posible to create a block with multiple sliders, then when a press a link the one slider scrolls and the oterhone scrolls to but with a delay of lets say 10seconds?
  50. inosense
    February 2, 2009

    Excellent slider script. I will use it on my new portfolio site and implement it in Joomla!. A question - if I make a Joomla! extension out of it - how about the credits for using the script?
  51. andrewthong
    February 2, 2009

    Useful plugin, easy to work with! I'd love to see pagination/numbering in future revisions.
  52. Keith
    February 3, 2009

    As Liam Morley and Geoff have also noted, a continuous loop would be a great addition. i.e. slides moving from 1, 2, 3, 1,... as opposed to "rewinding" 1, 2, 3, 2, 1...
  53. Ben
    February 4, 2009

    I am trying to implement this slider into a page I am working on. I am having a couple main points of "contention"! It seems to work properly in FF, however, if I refresh the page, the browser is adding different widths and heights to the div.slider, and really throwing a wrench into the design. Any ideas why this may happen on refresh? It doesn't appear to be doing this on my "test page"... http://spinmarkettemplatev3.spintest.com/slider_test.asp Thank you for any assistance or direction you might be able to provide!
  54. Ben
    February 4, 2009

    The site I am experiencing the issue with that I mentioned in the post above is here. http://spinmarkettemplatev3.spintest.com/_inside.asp Not sure why, but in FF, it is appearing to change the class of the div “slider” from 310px wide to 1124px (and also changing the height from 150 to 190). Thanks again.
  55. Benny Risanto
    February 5, 2009

    Thanks a lot, my next project will inspired of this article..
  56. Ben
    February 5, 2009

    My problem has been resolved. Somehow, moving the slider classes inline into my page (as opposed to referencing them in an external style sheet) corrected the issue. Sorry to clutter up your message board with nonsense! Love the slider now that I have it working!
  57. Jack Boberg
    February 5, 2009

    Great script. Ability to pause on hover, or a stop() and start() that could be bound to events would be very useful.
  58. Sigurbjörn
    February 5, 2009

    Great plugin, thanks ;) I had one problem where i had only one image in the slider but the next button was displayed regardless. So I modified line 72 as follows ... Before: if(options.controlsShow){ After if(options.controlsShow && s > 1){ // where s is the <li> count Best regards...
  59. Andy
    February 5, 2009

    I have to agree that the pause/play button would be a very handy feature indeed. This is all it needs to turn this into the best news slider for jquery ;) Any tips on how I could go about adding this? Thanks for a great plugin!!
  60. Ed
    February 6, 2009

    One more vote for a continuous cycle without rewind - thanks!
  61. chris
    February 6, 2009

    Great script though it reduces accessibility, the back and forward button doesn't work, any idea how to add back the back and forward button?
  62. James
    February 7, 2009

    First of all, Outstanding.. I truely am a newbie and have managed to get this script working and customised. Trouble is; being a newbie any deviation from simpleton instructions can send you into a spiralling spell of frustration :) I'm trying to integrate EasySlider with Photobox and hoping someone can help... http://www.jamesrouse.com/lifestyle_easyslider.php that is easy slider working http://www.jamesrouse.com/lifestyle_photobox.php that is the photobox working http://www.jamesrouse.com/lifestyle_both.php this is 'meant' to be them working in harmony together. any pointers would be very much appreciated!! thanks
  63. ?????
    February 8, 2009

    thank you this is a usfuel project
  64. Greg
    February 8, 2009

    @cssglobe: Do you have any idea of when you might be releasing the next update? As far as ideas... you may want to try to incorporate some of the things that <a href="http://www.5bosses.com/examples/agile_carousel/multi_example/carousel.html">this script</a> has.
  65. b
    February 9, 2009

    Great plugin. The only thing it needs is page numbers under, which link to the slide number and then it could be used for anything really. Good job.
  66. Stu | selfconclusion.co.uk
    February 9, 2009

    Thanks for this mate! been working on a new portfolio and wanted to incorporate something like this :)
  67. Garrett
    February 10, 2009

    CSSGlobe & Joseph - I discovered the source of my problem with it not working in safari or chrome. I went back to using version 1.2.2 of jquerey instead of 1.3.1 and it fixed the problem. I had been using jquery for more than one feature on my site and found that it fixed a unrelated problem pertaining to a different script as well.
  68. Donna
    February 10, 2009

    Hi, I love this slider, it's wonderful! I just have one hitch though! I got it working perfectly with two arrows positioned on either side of the box.... and then I resized my window. The arrows stay exactly where they are but my fixed, centred site stays in the centre of the window. How can I position the arrows so that they are fixed to the maincontent div when it moves? I'm a graphic designer who is a definite newbie on this stuff, learning by trial and error over the past couple of months. Any assistance is appreciated! Thanks Donna
  69. mike
    February 10, 2009

    Seconding what everybody said on here, this is one of the best slideshow jquery plugins ever developed. It's simple like it suggests and only takes a few mins to implement. Having said that, does anybody here know how to modify the script a bit so that it only cycles through each list item once and then starts back at the first one (ie. 1 >> 2 >> 3 >> 4 >> etc. >> end >> slide to back to 1, then story)? Any help is much appreciated! P.S. Can confirm that this works as described in FF2&3, IE7, Opera 9, Safari 3 and Google Chrome 1 on Vista
  70. Stewart Goodwin
    February 10, 2009

    Is it possible to integrate this with the jQuery Easing plugin? If so how?
  71. Vayu
    February 11, 2009

    HI, I wanted it to show 2 images/content at time like several others here have requested. I am using it to run vertically. I quickly looked at the code in the easySlider.js file and changed this line "obj.height(h);" to "obj.height(h*2); " and it seems to work. The same goes for horizontal views. Just changed this line "obj.width(w);" to "obj.width(w*2);". I am no jquery/javascript expert and I havent tested it in other browsers than Firefox 3. Can it be that simple? Cordially Vayu
  72. Garrett
    February 11, 2009

    Vayu - Yes it can be. I simply placed multiple items inside a div inside the li and as long as the height and width of everything is defined it works great. I acturally crated a few that have just one item in one slide and then several in the next - all inside the same slider: http://70.96.242.7/~sunstate/restaurant-merchant-accounts.php
  73. fredj
    February 12, 2009

    hy, just thank you for this useful and light script ! thanks again
  74. Jeff
    February 12, 2009

    I was having the same issue in Safari 3.1 and 3.2 with the Next/Previous buttons disappearing and not reappearing properly. I solved the problem by changing two things: 1) CSS: in the #prevBtn, #nextBtn, #prevBtn2, #nextBtn2, overflow is set to hidden, change this to visable. 2) easySlider1.5.js - prevText and nextText leave blank so there is no text to display. This hurts accessibility, but it solves the problem.
  75. kyle
    February 14, 2009

    This is great, anyone figure out how to implement a continuous loop (no backwards scrolling at the end) like many others have asked above?
  76. Bix
    February 15, 2009

    How can i just go directli to a picture by a GET Link or Javascript or what ever? Nice Job :-) i'm just learning all that :-)
  77. Bix
    February 15, 2009

    in your code i can find (easySlider1.5.js) html += ' <span id="'+ options.prevId +'"><a href="javascript:void(0);">'+ options.prevText +'</a></span>'; But how can i get directly picture nr. 4 when open the pageview of the slider? Where do i get that Variable from? thats all what is missing and i slowly give up on it. Actually i really dont want to, because its so great :-)
  78. GeraldS
    February 15, 2009

    Very nice script. I expanded it a little to show the current position in the slide. If you are interested to add it as an option for the next version: html += ' <span id="position">'+(t+1)+'/'+(ts+1)+'</span>'; and at the end of the animate() function: $("#position").text((t+1)+'/'+(ts+1));
  79. Donna
    February 16, 2009

    Has no one else had any issues with a centred fixed website? My arrows won't stay in the same place when the window is resized :( Any help would be really appreciated!! Thanks, Donna
  80. ravex
    February 16, 2009

    Hi. please help me with adding some effects after slide event... how add "fade effect" to a #text <div> or <li> inside #slider tag 1. image is sliding 2. after this action i want fadeIn #text in current image how i can?
  81. Fernando
    February 17, 2009

    Hi. I have a question. How do I add and button (play and pause) to the plugin for sliding images. I think that this plugin can play the role of this one : http://www.bannerengineering.com/es-MX/ but It doesn't have and play & pause button. Any idea ? please
  82. bix
    February 17, 2009

    Thanks GeraldS, i will try that out, i hope it works. Oh and if you have different sizes, just put in a table with align=center. put the Buttons padding to the right position, because, bigger container... bigger space between the buttons
  83. Nick
    February 18, 2009

    I am trying to add a counter to this. I want to show what slide you are on and out of how many (1 of 4). Has anyone else done so? Great plugin, so easy to use. Thanks
  84. rahim haji
    February 18, 2009

    as stated by all.... this is a good plugin... well done. I was wondering if you can help me tweek it slighly. When at the last image and the next btn is clicked (or on continuous animation), can i get the slider to just scroll to the 1st picture rather then scrolling through them all and then shounf the first slide? regards, Rahim
  85. ESP
    February 18, 2009

    Lovely slider! I've tried to add the lightbox (http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm) feature to my slides to display some work, but the jquery file is clashing with the new js files. I have limited js knowledge and wondered if you might know why? Cheers
  86. Donna
    February 19, 2009

    Hi - I finally fixed my moving buttons and thought I'd post the solution. It's really basic, I'm probably the only one to even have this problem (in my defence I am very much a beginner :)). I just needed to make my maincontent div position=relative. Then my slider div position=absolute. Then voila! perfect :)
  87. Firenza
    February 19, 2009

    Great script. Just the right weight, not at all overfeatured. Works with jquery 1.2.6 but any chance of a quick fix for jquery 1.3.1 users? All the best!
  88. Danny
    February 19, 2009

    I would like the Next & previous button on top instead of the bottom... how? kudos for the script!
  89. Jennae Petersen
    February 19, 2009

    I am completely new to this, so forgive me if my question makes it obvious :) . Where do I put the following lines of code: $(document).ready(function(){ $("#slider").easySlider(); }); I am completely new to this, so forgive me if my question makes it obvious :) . Where do I put the following lines of code: $(document).ready(function(){ $("#slider").easySlider(); });
  90. Jennae Petersen
    February 20, 2009

    OK...it looks like I've gotten all the javascript where it's supposed to be and the style sheet set up, but the slider isn't working. It's just displaying my images stacked on top of each other. Someone help! See it here: http://hibiscuscreative.com
  91. Fransnico
    February 20, 2009

    Great works Alen.. I know this question already asked before.. Is someone already figure out how to make the slide cycling in one loop? 1>2>3>1>2>3.... really need it for my project.. Please help..
  92. Lorne Pike
    February 22, 2009

    Looking forward to playing with this. I like Nick's idea of adding a counter. Would be very helpful when presenting a larger number of images. Overall though, great script. Thanks.
  93. brian
    February 22, 2009

    Would be great to use dynamically loading content (images) rather than needing them all inline? Thanks
  94. Taylor Regan
    February 23, 2009

    This is fantastic! <<thunderous applause>> It's just what I was looking for and adds a nice touch to my website. Thanks!
  95. Jared Crossley
    February 23, 2009

    Great, highly-customizable, light-weight script. Thanks! A small JS error is showing up in my debugger, related to the JS inserted into the <head>: <script type="text/javascript"> $(document).ready(function(){ $("#slider").easySlider({ controlsBefore: '<p id="controls">', controlsAfter: '</p>', }); }); </script> ControlsAfter: '</p>', is throwing an error, saying that the character "/" isn't allowed. I tried converting it to an HTML entity (⁄) but that didn't work either. Any ideas? Thanks, ~Jared
  96. Jared Crossley
    February 23, 2009

    Hi again, I also tried the decimal value & #47; (space added 'cause it looks like the comment system strips out HTML entities). Same problem. ~Jared
  97. GeraldS
    February 23, 2009

    Another addition: This block right after "$(obj).after(html);" hides the next/previous links when only one list element is present in the list. if (ts < 1) { $("a","#"+options.nextId).hide(); $("a","#"+options.lastId).hide(); $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); }
  98. Garrett
    February 23, 2009

    Now following CSSGlobe in Twitter. Booya.
  99. Chanie Pritchard
    February 24, 2009

    This is the new slider of choice for us. Excellent work!
  100. Jared Crossley
    February 25, 2009

    @Jared Crossley (me): I found a solution to the improper rendering of the forward slash '/' in the following line: controlsAfter: '</p>', Simply replace '</p>' with '</p>' -- this will escape the invalid character. ~Jared
  101. John Mac
    February 25, 2009

    Is it possible to make the last one link onto the first one as seen on the http://www.bbc.co.uk/ site ( iplayer section)? Notice how its continious and the last joins the first. Thanks.
  102. Marc
    February 26, 2009

    Great plug-in! I spent longer then i should have trying to get the scrollTo plug-in to work and finally gave up, found this and had it set up in minutes. Had same Safari/Chrome issue with disappearing buttons(.png) but found they dont disappear if they are set inside the #slider div. Im not going to change my Jquery back to 2.2 but i will change the #prevBtn and #nextBtn to visible and test that as Jeff suggested.
  103. Marc
    February 26, 2009

    Tested on MAC Opera 9.2 OK and Safari 3.2.1 OK both with button(.png) Divs visible.
  104. Miguel
    February 26, 2009

    How to get the value of "t" outside from function animate(dir,clicked)? I like to get the current value of t but it doesn't work: html += '<span id="myid"><a href="images/myimg/'+ t +'.gif" id="btnImg" class="btnImg">My Image</a></span>';
  105. Zend
    February 26, 2009

    Hi Miguel we have same issue, Im new to jquery anyone knows how to do this: if(options.controlsShow){ var html = options.controlsBefore; if(options.firstShow) html += '<span id="myid"><a href="images/myimg/'+ t +'.gif" id="btnImg" class="btnImg">My Image</a></span>'; $(obj).after(html); }; I want to get the value of ( t ) when I click next then suppose to get the next counter 2, 3, 4 . Any help is greatly appreciated.
  106. Pieter
    February 26, 2009

    Finally found a good use for this. It's a great and very, very easy to use plugin. Thanks!!!
  107. Peter
    February 28, 2009

    I have the same issue as Rich. When loading a new page or refreshing with F5 - there is a pause while the image(s) load. Is there anything you can suggest to address this or to better preload the images? I'm not sure exactly what the issue is.
  108. Andreas
    March 2, 2009

    Hello, Andreas from Germany here. I try to insert the slider in a customer project, www.adminforyou.de/bd/index.php but the slider doesn`t work. (the demos work fine). IE7 shows an error message "jQuery" is undefined, line 31, char 1" and a second error message "this object does not support the property or method, line 19, char 4 " (translated from german error message) what is wrong with my index.php? Could anyone help me? Thanks a lot from Germany Andreas
  109. Andreas
    March 2, 2009

    Hello, oh, i am sorry! i have found the reason for the bug. The jQuery has to be inserted before the easyslider.js. Great slider, wonderful! Andreas
  110. George from Ohio
    March 2, 2009

    First things first, GREAT SCRIPT. It's so clean and easy to use. So far the only issue I have is that I can't seem to get this script to print the whole ul using the print.css. Did anyone have the same issue as I did? Let me know. Any help would be appreciated. Thanks.
  111. Brian from Minneapolis
    March 3, 2009

    Great script! Super useful. Thanks for sharing. I noticed a display bug when using a SWF in the one of the "panels" where Firefox (only on Windows) won't hide the Flash when its on either side of the slider viewing area. Has anyone come across this and if so, had any luck fixing it. Ah... browser inconsistencies. Gotta love 'em.
  112. Hesham from Egypt
    March 4, 2009

    Nice Script :) I've added a paginator to it and some other stuff. Editing it was very easy. Keep the good work.
  113. Orlando Bennington
    March 5, 2009

    What a nice script! I'm just starting with jQuery and that I'll help a lot! Thank you!
  114. Kevin
    March 5, 2009

    Is there a way to change the position of the next - previous button? Meaning put it on the top rather than the bottom. :)
  115. Ravi Kotak
    March 5, 2009

    I found something that makes it work with loop. http://bogojoker.com/easySlide/ Thanks
  116. christopher Jack
    March 6, 2009

    Thanks so much, that's what I am looking for :D
  117. Benjamin Reid
    March 6, 2009

    @Kevin - Change XXX to your desired postion #prevBtn, #nextBtn{ top: XXXpx; }
  118. Bryce
    March 8, 2009

    Thanks for this. Great work! I have a feature request: Instead of when the auto scroll reaches the last item, going all the way back to the first one just show the first one next (if you get what I mean) i.e go 1,2,3,1,2,3 not 1,2,3,2,1,2,3
  119. Hase
    March 8, 2009

    excellent script! thank you so much for that! unfotunately there sems to be aproblem with the wordpress motion theme (http://www.themelab.com/2008/06/23/motion-free-wordpress-theme/) either the accordeon script or the slider script woks. any hel appreciated!
  120. Hase
    March 8, 2009

    and there is some odd behaivour if I try to embed youtube videos. the overflow:hidden doesn't seem to work in this case. is that possible? works in ie but not ff
  121. Anton
    March 8, 2009

    Hi! Well done! If you add opportunity add text on pictures, it will be superuniversal plagin!
  122. Johnny
    March 9, 2009

    Hi Excellent Script you got here! just got into a little trouble. The contents on my slides are pages with bullet lists. This causes problems in away that every bullet list on my contents adds a blank page on the slide so it scrolls with a lot o f blank pages on it. Any fix for that? Many Thanks! Keep up the Good Work!
  123. Stuart Thursby
    March 9, 2009

    Very nice script & effect, will be using this on my site's re-design. A perfect, compact way to present a portfolio of work!
  124. Bokelmann
    March 9, 2009

    how can I jump to a specific sliding-item? (Button1 for slide 1) (Button1 for slide 2) (Button1 for slide 3) etc? cheers
  125. Mistral
    March 10, 2009

    Awesome , looking for this for sooo long !!! Wow , thank you so much for this , you're KING !!!! Regards, Mistral
  126. Teebek
    March 11, 2009

    Hi, Very nice script and simple to use. I've tried to use it with Yetii script but it seems that it doesn't work. If someone has a solution, I'll take it ;-). Regards.
  127. chuck
    March 11, 2009

    This slider plugin is awesome, great job, - I have however seen that a number of plugins, like this one, do not work with jQuery 1.3+ - I am trying to figure out what adjustments need made, any input would be apprecaited.
  128. Miguel
    March 12, 2009

    You have really smashed all the other sliding plugins around the internet! Great work.
  129. Florian
    March 12, 2009

    I really like the app. but there are 3 things bothering me. 1st one, in safari on first page load you will see nothing more then 10px of the top of the slide.. after refresh it works just fine. 2nd one, before the whole page is loaded, all of the images are displayed in list order... how can i fix this? 3rd one, w3c validator says: Line 16, Column 34: document type does not allow element "p" here. controlsBefore: '<p id="controls">', Can you mail the answers to me? special Thanks!!
  130. Joa
    March 13, 2009

    Joseph Pecoraro's addition to this already super script with possibility do do the nice loop thing is just awesome! http://blog.bogojoker.com/2009/01/adding-looping-to-a-content-slider/
  131. wayne
    March 13, 2009

    This is awesome. can the slider able to start from centain slide when i enter the page, for example. start from slide no3. (direct from third thumbnail from previous page) :)
  132. asaaki
    March 14, 2009

    great plugin! one issue - when I save the demo pages, let's say "styled demo with auto scroll and continuous sliding", the images auto scroll, but the buttons don't work. When I write my own code and use the plugin as per this tutorial, the buttons work but auto scroll doesn't. I've spent hours on this but just can't find out where I'm going wrong. Help!
  133. Nicolas Borda
    March 15, 2009

    Hey @cssglobe, I have the Drupal module in ready, but I can't make a stable release until the nested content problem is fixed. Please let me know if you had any time to work on this. Cheers :)
  134. Martin Miranda
    March 18, 2009

    Awesome, I was just searching something like this Thank You
  135. kevin
    March 18, 2009

    i seem to get the error $("#slider") is null any one know how to get rid of this, i am using aspdotnetstorefront so its in the template on every page but the slider is only on the home page.
  136. naresh
    March 18, 2009

    very good one. but after it rotates 4 times i want it to loop it agin with smooth. in your work it is directly starting with first image again,
  137. Maged Makled
    March 19, 2009

    Awesome job with this plugin, I'm trying to make the slide to stop on mouseover and resume on mouseout. I tried ** $(document).mouseover(function(){ $("#slider").easySlider({ auto: false, }); }); $(document).mouseout(function(){ $("#slider").easySlider({ auto: true, continuous: true, pause: 5000 }); }); ** but not luck. any ideas? Thanks
  138. sonic22
    March 20, 2009

    Hi, Great plugin, i really like it, could you try to add a mouseMove function to slide with the mouse position over the #div Best Regards
  139. Mozes
    March 20, 2009

    Would love to see how they did the one at Bottlenotes.com
  140. mamjed
    March 20, 2009

    how can i change it so it doesn't slide, but fade?
  141. alvaro
    March 23, 2009

    Thaks a lot for this script, as noted before, how turn it to fade between each image?
  142. Gabe
    March 23, 2009

    Thanks for the great plug-in. I used it on my portfolio page - http://greenflipflops.com/samples
  143. Neil
    March 23, 2009

    Great script thanks a lot One more vote for a continuous scroll; thought 1>2>3>4>1>2>3...
  144. Nebbercracker
    March 23, 2009

    The slider at BottleNotes.com is cool. It has the sub navigation as images/thumbnails. Does anyone know how to do that?
  145. vishal
    March 24, 2009

    Wow!!! Great work! You are providing me with everything I want to know. Al your posts are so resourceful! Keep it coming!
  146. Kaya
    March 24, 2009

    Hi there, I have the same probme as several people before. I would like to add a navigation to the slider that points direct to certain container id's within the slider. Can anyone help please!
  147. Bulat
    March 25, 2009

    Hi! Please, help me. I need make this slider for full page (width=100%). How I can do this? Thank's.
  148. EngineHere
    March 27, 2009

    Thanks for this plugin ! I'm using it in Wordpress to slide pretty heavy <li> (see in my homepage) and it works nicely. It took me some time to figure out that I can use controlsFade: false , to make the whole thing more clear to people. Thanks for sharing !
  149. Hendrik-Jan
    March 27, 2009

    Lovely script. Would love to resolve the issue with nested li becoming slides. Tried to modify the script to the lis become spans but I couldn't get that to work. (I have no understanding of how JS selectes objects in the html.)
  150. Tyler Henson
    March 27, 2009

    @ Colin Scroggins I agree, it would be great to have the auto scroll resume after using the manual controls. Also, another thing I've seen is a "bounce" effect when each slide comes in. I think it would be cool to add some fun visual effects like that. I love how when you get to the end, it scrolls quickly over the previous slides to the first... awesome! Great script nonetheless!!! Thanks for all your hard work on it!!
  151. John Doe
    March 28, 2009

    I'm checking the first demo in IE 6, 7, 8 and it doesn't seem to work. Is anyone else having issues with IE?
  152. Barry
    March 30, 2009

    Excellent work! Kudos. One question, I have a client who wants it to cycle through all the photos and return to the beginning (as it does). BUT then he wants it to stop. Is there a way to do that? Thanks
  153. zeroday
    March 30, 2009

    will this work on drupal 5.x installation? cuz all the xhtml transitional effect dont work on it...drupal is strict....can anyone shed light on this...please, i really like this plugin
  154. DDamir
    March 30, 2009

    Very nice. Pozdrav iz Beograda.
  155. kevin
    April 1, 2009

    is there away to add a conditional statement to this eg. if default.asp show slider if not hide. I am getting an error on ever page its not on becasue it cant find it.
  156. Hakan Folkesson
    April 2, 2009

    Thanks! Great work! I would like to use this if it would work with nested list items.
  157. Darren Taylor
    April 3, 2009

    Excellent plugin thanks! Would anyone have a working example of one with captions below or overlaid on top of the images?
  158. zarouk
    April 3, 2009

    hi all, It will be great to have more type of effect like the "ImageSwitch" project for example : http://www.hieu.co.uk/blog/index.php/imageswitch/ Best regards, PS : sorry for my english, i'm french :)
  159. Garret
    April 3, 2009

    Has anyone got easy slider to work with sifr? I'm having trouble.
  160. jeroen
    April 5, 2009

    Very nice script! as anybody else I have some questions: You use a list now, is it possible to make it a div? (solves the problem as well with putting a list in there) If It would be possible to change it into a div, could you put in 6 div's standard and change in an external stylesheet for example the last two div's: #div5, #div6 { visibility: hidden; or display: none; } Thank you for this great script!
  161. jeroen
    April 5, 2009

    I tried some things with putting a div inside the list but that won't work. How can I put an div inside or make it all a div?
  162. magelover
    April 8, 2009

    Hi Thanks for the plugin...but I have problems in Safari and Chrome - the size of the slides is all wrong. In all other browsers shows perfectly...any possible solutions?
  163. irka
    April 8, 2009

    I included this plugin on my website, nice and smooth working on Firefox, Opera and Safari... but i've done the same mistake as always - I didn't check before, if it is working with f... IE. And it doesn't work.. So i checked this demos from this post - don't work on Internet Explorer.. what a pitty :( I really like this plugin, its simply and elegant, but well,, doesn't work with IE. Anyone here, any suggestions:)? thank you anyway, it is still very inspiring slides gallery.
  164. irka
    April 8, 2009

    just checked - this plugin works prefectly on older versions of IE. Doesn't work on the latest (IE8). Internet Explorer sucks as always :/ It shouldn't be never developed (IE), piece of junk, that's it! I can imagine this dozens of plugins which aren't compatibile with this piece of shit (IE). And I can imagine all this hard develpoers work for nothing.
  165. Peter
    April 8, 2009

    If you don't want the images to show up in a list when you refresh the page, add this to your css #slider { visibility: hidden; } and add this to you document ready function just before you invoke the slider: $('#slider').css('visibility','visible');
  166. Joshua
    April 9, 2009

    Great little plugin! Not sure if this is already an option, but a nice addition would be the ability to use multiple images within the viewing area.
  167. ewd
    April 10, 2009

    I would also like to be able to use .png files with this? Any chance?
  168. Eitan
    April 10, 2009

    if i want to stylize the First and Last buttons how would I do that? i want to make them images, just like you did with the next slide and previous slide buttons...Oh also in your next version a page linker thing would be could so you click a button and it goes to a certain page...
  169. David
    April 13, 2009

    really nice plugin [h]
  170. PF
    April 14, 2009

    Hi, Great script, really love it! Would it be possible to place a link first and last photo somewhere else in the page. Something like: Lorem ipsum dolor sit amet, click HERE to view the last image of the slideshow. Lorem ipsum dolor sit amet. Thanks!
  171. Christopher Scott
    April 14, 2009

    Thanks so much for this plug-in, it's lightweight, effective, powerful, and customizable!! I did have some issues with Webkit, especially mobile safari, but I think i was able to get it working ok now. If anyone's having the same trouble hit me up @christopherscot (only one "t") on twitter, and if I'd be happy to help if I can. I use it to 'feature' a handful of projects from my portfolio on my homepage, check it out here: http://christopher-scott.com
  172. Franky
    April 15, 2009

    This is great!
  173. osu
    April 16, 2009

    Hi, Working fine in all browsers except Safari 3.2.1 - overflow:hidden; doesn't seem to restrict the width of the list item meaning the scrolling goes insane. Tried using an earlier version of JQuery, but same problem. Any ideas what I can try? Thanks
  174. osu
    April 16, 2009

    A bit more info: It seems this is a Javascript issue because when Javascript is disabled in Safari, the list item width is restricted correctly - not sure what to do from here, can anyone help?
  175. osu
    April 16, 2009

    I found a 'solution' - if you add inline CSS for the widths of each list item (i.e. <li style="width:540px;">Item</li>), then it appears as it should. Is it just me who had this or maybe this could be useful as a change request? Thanks for the plugin!
  176. sujit kumar
    April 16, 2009

    great script i was just searching for this, with little bit of alteration i made it for multi image slider.
  177. Alexandre Broggio (Brasil)
    April 16, 2009

    Muito legal este script muito topos feitos em flash agora j da pra fazer em jquery facilmente vlw
  178. David Ljunghill
    April 16, 2009

    Great plug-in, thanks! Concur with a couple of the previous posts - it would be even greater with the possibility to jump directly to a specific slide.
  179. James
    April 16, 2009

    I would also like the ability to have multiple list items shown at once.
  180. rory
    April 17, 2009

    YOU BEAUTY! I was looking for a tutorial on this for ages, felt my web design was becoming a bit flat recently, so this java treat will bring some fun back to my designs. Thanks I'll give this a test a the weekend.
  181. sivas
    April 19, 2009

    very good, thank you
  182. Tye
    April 20, 2009

    Did anyone get a fix for Internet Explorer 8" - why do Microsoft even bother.... I wonder if this signals the start of many fixes to existing websites :(
  183. Anselmo Martin
    April 20, 2009

    Good work. I have tried to work within a Iframe by design requirements (popup window) but there is no way. Intends to fix it? Tanks
  184. Christine
    April 21, 2009

    Is there anyway to use nested lists or divs to house not only an image but a caption or description on an overlay? I have tried this and it works fine in Firefox, but in all versions of IE the nested list items are all visible at once and extend off the width of the slider causing horizontal scroll bar.
  185. Jörn
    April 21, 2009

    Hi, really nice plugin! but does it work with the history-plugin too?
  186. Ray
    April 22, 2009

    Hi - this is working really well for me, with one exception. In Safari it loads fine. But, if I move on to another page and then come back using the back button, all I can see is the top 20px or so of the images (all of them). They are still scrolling fine, and the buttons are still intact. Has anyone come across this? Cheers - thanks for the plugin too!
  187. jerome
    April 22, 2009

    A solution for a multiple slides (images) at the same time? Thank a lot
  188. sopheak
    April 23, 2009

    I have been waiting to get it for a while. it's so fantastic job. Thanks
  189. JR
    April 23, 2009

    Hi, please will you tell me if it is possible to link this to a menu list or as per and earlier request bellow?: "Bokelmann on 9 Mar, 2009 wrote: how can I jump to a specific sliding-item? (Button1 for slide 1) (Button1 for slide 2) (Button1 for slide 3) etc?" Many thanks for a fantastic piece of work JR
  190. jerome
    April 23, 2009

    A solution for multiple slides (images) at the same time? Thanks
  191. andres
    April 26, 2009

    play and pause bottom, that`s a good idea
  192. Al
    April 27, 2009

    your slider is very cool, a numbered pagination will be a really good feature :)
  193. Oliver
    April 28, 2009

    I seem to get a problem when viewing it in IE7. All the <li> elements that im trying to slide through are showing up at the same time. I have tried rolling back to an older version of jquery but it still doesn't show/work properley. Works fine in FireFox though. Any ideas on how to fix this?
  194. jeroen
    April 29, 2009

    wow nice scroller! I'm new to jquery, I used to use mootools. Nice and easy functionality this! One question, I'm using the slider on my site right now (www.ademaweb.nl). On only the first second all images 'blink' underneath eathother, is there a solution for this?
  195. Josemi
    April 30, 2009

    Hello! First of all i want to thank you the great script! I have used it in a site and it works great but i am experimenting some problems! It doesnt works always, its kind of random, somethings works, something not! Would be great if you could have a look a say to me your ideas because i am getting crazy! Thanks!
  196. Tihomir Mihaylov
    April 30, 2009

    Hello! The plugin is great! There is something that I can't do. When I set auto and continious scrolling, the scrolling is horizontal and not vertical! Is there something else that I should do?
  197. Dave
    May 1, 2009

    Having problem. The slider will not scroll and when I ad more than one item it just comes up below it . Any ideas?? I am using it within a theme written by somebody else if that makes a difference. thank you
  198. Ivan
    May 4, 2009

    I couldn't overcome the problems with Safari and Google Chrome so I decided to use this other slideshow: http://sorgalla.com/projects/jcarousel/ it's also a powerful plugin. Thanks anyway! I'm sure in a different instance it'll work - but for some reason this time didn't want to work...
  199. Chad
    May 4, 2009

    This plug-in is very useful for a lot of our sites, but people seem to have a problem with it rewinding back to the beginning, I've tried to use the BogoJoker version of your plug-in, but his doesn't work in all browsers where as yours does. Any help would be greatly appreciated.
  200. F
    May 4, 2009

    great article! Very easy to understand and customize. Thank you for sharing! keep up the good work!
  201. xaer8
    May 4, 2009

    Great plugin. Fully customizable and works in IE too! Thanks for sharing!
  202. Antonio
    May 6, 2009

    Beautiful effect. You can make the effect "fade in" and "fade out" alternatively the Slide Left or Right ? Thanks
  203. Blair Nichols
    May 6, 2009

    Awesome article, found some others before this one but this plugin seems the best. Thanks.
  204. Bill MacKrell
    May 6, 2009

    Great article and plug-in. I'm new to javascript & Jquery but been doing web dev and learning CSS for a while now. This helped me jump right in and add an impressive feature on the front page of my site. One question: I am getting a strange behavior in IE8, the script takes a second to run at which point you see all three images in a row down the screen. doesn't do that in any other browser. Is that an IE security script thing? - Thanks again!
  205. miniMAC
    May 6, 2009

    Hy! Here is a solution for SAFARI and CHROME? Now called "EasySlider" must be "HardSlider"? Someone has a solution? CSSglobe??? FIREFOX: OK I.E.: OK OPERA: OK STAINELSS: NOT WORK
  206. jialong
    May 8, 2009

    Great plugin Thanks
  207. sivas haber
    May 10, 2009

    very good
  208. Barton
    May 11, 2009

    I'll echo the previous statements, brilliant script. Also, I agree with the Hover pause functionality, then it's there! Keep it up, Barton.
  209. Tom tom
    May 11, 2009

    Sounds like a n00b question, but I checked I have both jquery included and the script in the head and still it loads only one image. I can still see all the other images in the source but no slider. Any ideas what can it be?
  210. Paul
    May 12, 2009

    Hi Yes the script works brilliantly except I get a all images appearing a moment before load. So I put height on UL container which fixes it but now is JavaScript is off, you can only see one image. Is it possible to have a 'next' and 'previous' link when JavaScript is turned off? Thanks
  211. noisebleed
    May 13, 2009

    Is there a way to identify the current visible element? I'm using this plugin as an image selector, so I need to know which image/element the user is viewing so I can save his preference.
  212. Phillip
    May 14, 2009

    Do you have a plugin that will loop around several divs with a show hide method for each div? I'm trying to get this code to do that but I'm at a loss. Thanks
  213. jostill
    May 15, 2009

    Can anybody help me with an issue with my site. It's working fine in Safari and Firefox but in IE the images just appear in one long line. I need this to work for Sunday as it's for my degree. Probably something simple with code but I'm stuck. Be grateful for some advice. http://www.andywood.co.uk/jo/enzo
  214. jocuri
    May 15, 2009

    I try to put buttons but not still working... I put link buttons in <div id="slider">: <span id="prevId"><a href="javascript:void(0);">Previous</a></span> <span id="nextBtn"><a href="javascript:void(0);">Next</a></span> but on click not working :|. Thanks
  215. Tom
    May 15, 2009

    Really good one. But I'm having problems implementing this into my site. Prev/Next button somehow disappeared.
  216. Xth
    May 16, 2009

    Thx for the script.. :">
  217. Thifu
    May 17, 2009

    Nice job... I slightly modified the script to include a callback function, with the slide we come from and the slide we go to as arguments : // default configuration properties var defaults = { esCallback: function(thet, thets){}, ... } ... then we add the following line to a.nextId.click() and a.prevId.click() : options.esCallback(t, ts); That's for the script. Then in my Php/HTML page, I call EasySlider the following way : $(".myslideshow-content").easySlider( { // My callback function : esCallback: function(n, nmax) { alert('Slide '+(n+1)+' out of '+(nmax+1)); } }); Here it is ! After the user clicks a "Previous" or "Next" button, my callback function is called and my website can react to the change. Thanks a lot for the script anyway ! (if anyone needs the modified version of the script, maybe I can upload it somewhere...)
  218. Nagavardhan
    May 17, 2009

    Hi, Thx for gr8 script. Its working fine in IE7+ but in IE6 its not working properly. Please suggest any. Follow the below link http://boulderfirst.com/test/olafe
  219. jeroen
    May 18, 2009

    is it possible to get 'dots' underneath the slider, that correspond to the slides? So 4 dots: when I press dot 1 I go to slide 1? tnx for the great work!
  220. Frank Patterson
    May 18, 2009

    I'm building a form using EasySlider 1.5 - is there a way to trigger the action by tabbing to a field with an ID or Class? Here's the page in question: http://www.fordpas.org/registration/teachers_coordinators/form_v2.asp
  221. jgjax
    May 18, 2009

    In Safari, my next arrow shows...but does not trigger slide action. Can anyone help please??? Yes, I'm new to this also. Thanks.
  222. nicolas
    May 19, 2009

    Muy bueno, la verdad qeu se agradece!!
  223. safe as milk
    May 19, 2009

    thanks for this plugin anyone worked out this yet? "how can I jump to a specific sliding-item? (Button1 for slide 1) (Button1 for slide 2) (Button1 for slide 3) etc?" would be perfect
  224. sudeep
    May 19, 2009

    Thank you so much for the great slider.
  225. sudeep
    May 19, 2009

    Thank you so much for the great slider.
  226. Steve
    May 19, 2009

    Hi guys, after tinkering with the slider I seem to have found a fix for the Google chrome issue where the buttons seem to disappear. In the css file that contains the slider's styles, remove the whole section/style for image */replacement, if you test your slider, you should notice that the buttons are appearing normally in Firefox, I.E and chrome, but the button text is appearing above it. Open the js file easySlider1.5.js and remove the nextText: 'Next' so that its only nextText: '' with nothing in the quotation marks, save your file, test your slider, you will notice that the text has disappeared but there is now a blue blue bounding box around it in firefox, open up the css file that contains the stlyes for the slider and insert outline:none; into the stlyes for #prevBtn, #nextBtn{ + #nextBtn{ + #prevBtn a, #nextBtn a{ + #nextBtn a{ , this seemed to solve the issue.
  227. Steve
    May 19, 2009

    I forgot to mention, do the same for the previousText aswell in the js file :P
  228. Jon
    May 19, 2009

    First of all great code. Simple, lite. I wanted to have the auto stop when you clicked on the slider so I added: $("#slider").click(function(){ animate("stop",true); }); around line 94 and: if(options.auto && dir=="stop" && !clicked){; timeout = setTimeout(function(){ animate("next",false); },options.pause); }; around line 156
  229. Erik Wallace
    May 20, 2009

    Beautiful, thanks for sharing Alen. Along with a few other people I'd love to see pagination included in the future, please contact me if you choose to do so. Apparently Hesham from Egypt added pagination, I wish I was that savvy with Javascript. Alas, I am not quite there yet.
  230. Amit Dixit
    May 20, 2009

    Hi Allen, first od all , Nice slider you built there, ok, i have a bug in IE7, inside the <li> tag i have a <div> with FLOAT:LEFT; this works perfect in Mozilla , Chrome and Safari but not in IE 7 in IE 7 all the slider <li> tags are visible throughout the slider Can you tell me why this happens ?
  231. Markus
    May 20, 2009

    Great slider, very simple and very usefull! Thx for sharing ;-)
  232. Fred
    May 21, 2009

    Great work. It's people like you who keep us in a job. I have one question, can I call the next div or prev div programtically instead of a button click. Regards, Fred
  233. will jaspers
    May 21, 2009

    There is a bug. If the list-item height and width styles are not defined, and continuous mode is true, the slider overshoots the last item -- or the last item doesn't appear at all. I can't tell if the slider is starting from the wrong position or if it is simply mis-calculating something. The problem only seems to apply to Mozilla browsers (non-IE). I can't tell you how much I appreciate this plug-in though! It is smooth, lightweight, and easy to install!
  234. red india
    May 21, 2009

    For those having problems with Internet Explorer where the content lines up all in a row to the right, and the overflow is not hiding, you may want to check the attributes you have assigned to your <a> tags. I've noticed this problem with some CSS frameworks like Blueprint. Make sure your anchor tags are assigned position:static.
  235. Cody
    May 22, 2009

    I have a better way to implement the controls here that allows much better customization, and placement of the controls anywhere on the page. Comment out these lines in easySlider.js /*html += ' <span id="'+ options.prevId +'"><a href="javascript:void(0);">'+ options.prevText +'</a></span>';*/ /*html += ' <span id="'+ options.nextId +'"><a href="javascript:void(0);">'+ options.nextText +'</a></span>';*/ Now, add the controls directly within the page layout wherever you like. For example: <div style="float:left;"><span id="prevBtn"><a href="javascript:void(0);"></a></span></div> <div id="slider"> <ul> <li>Contents for slider here</li> </ul> <div style="float:left;"><span id="nextBtn"><a href="javascript:void(0);"></a></span></div> </div>
  236. akitae
    May 23, 2009

    Is it possible to place a horizontal slider as a item of a vertical one?
  237. dlv
    May 24, 2009

    really great, thanks you Alen !! also i want to fade in/out instead sliding...so i'm gonna wait until someone show us how we can do that adeux!
  238. Alberto
    May 24, 2009

    First of all congratulations. This is my web site and I'm having some problems implementing your slide. It works perfectly off line... but when I upload my website on the server it goes really wrong. Any help? Thanks.
  239. Alberto
    May 24, 2009

    First of all congratulations. This is my web site www.ciao-caio.com and I'm having some problems implementing your slide. It works perfectly off line... but when I upload my website on the server it goes really wrong. Any help? Thanks.
  240. tom
    May 25, 2009

    how to get rid of queuing slides?? thx
  241. Candace Haynes
    May 25, 2009

    I bet its probably simple to combine but my mind can't grasp the ways of javascript/jquery therefore it is beyond me... but I believe you should implement an option that has this effect (captions) with this plugin. These two scripts along with a blender (to combine them) would be exactly what I want for my website lol Example below... http://buildinternet.com/live/boxes/
  242. Ismael
    May 25, 2009

    I'd like the feature that disables the rewind function and restart the animation in the beggining. Is that possible?
  243. William
    May 25, 2009

    thank you for a great plugin :-) (i use it on my new site)!
  244. Candace
    May 26, 2009

    I played around with this script and the one I referenced earlier two posts ago and I got it to work... very nice if you ask me. Except the caption appears on page load until you hover over and then acts as though I desired it too... http://rapidshare.com/files/237262818/easysliderwcaptions.zip
  245. Candace
    May 26, 2009

    Oh and I posted because I am hoping someone will fix it :( Probably simple but I am frustrated now...
  246. Joe
    May 26, 2009

    This is for images not content. This is really an image slider not a content slider. HTML elements added inside the LI tags used by the slider causes blank slides to be added. Each slide can only contain 1 image and 1 link. Content sliders allow you to add html/xhtml content to the slides. Unfortunately, I got this setup and created my slides before realizing this was image only :) I had 4 content slides followed by about 20 blank slides.
  247. Joe
    May 27, 2009

    In regards to my last comment, this does work with some XHTML content. I look out some DIV tags and another UL and my content works for the most part.
  248. Alexandre
    May 28, 2009

    First of all congratulations. I realy like this plugin, but it seams doesn't work on IE 8...
  249. Juan Manuel
    May 29, 2009

    Excelent !!!
  250. cleverkid
    May 29, 2009

    Concerning the question of being able to place list inside the slider without the script reading this as something to scroll, I think I have found a solution. Haven't implemented it yet in my production site I am working on, but I was able to get the demo to work by giving the containing ul a class name ie: ul.slideme and then changing the script to look for that class name. this.each(function() { var obj = $(this); var s = $("li.slideme", obj).length; var w = $("li.slideme.", obj).width(); var h = $("li.slideme", obj).height(); obj.width(w); obj.height(h); obj.css("overflow","hidden"); var ts = s-1; var t = 0; $("ul", obj).css('width',s*w); if(!options.vertical) $("li.slideme", obj).css('float','left'); I'll report back if I find any issue with it, but so far so good. Hope this helps some folks.
  251. cleverkid
    May 29, 2009

    from my previous post, let me amend that. you should give the containing li the class, not the ul ie: li.slideme sorry about that
  252. xchcl
    May 30, 2009

    hey, it s complicated! i can deal with it, can u help me??
  253. jsssc
    May 30, 2009

    excellent plugin thx for sharing …… i have translate it into chinese http://jsssc.cn i wondering will u add more beautiful animating effect on next release
  254. tax
    May 30, 2009

    Thanks for that great and useful plugin. Is there a way to click on a link and go to a specific slide?
  255. thai
    May 31, 2009

    In the styled version, one feature that would be nice would be an alternate image for the next button when you get to the last image. Like a faded or grayed out button. Great work..thanks.
  256. Ankit Sabharwal
    May 31, 2009

    nice plugin ! serves the purpose in an excellent way
  257. Mike Centola
    May 31, 2009

    Great Plugin! Very easy to set up and configure. One suggestion for a future version, and I'm assuming that it's pretty simple to do... the ability to adjust the speed of the return to the first slide when using continuous. I would imagine it is pretty easy to modify the plugin code to do this, but I wanted to let you know. Again great job and thanks!
  258. Vassilis Mastorostergios
    June 2, 2009

    Perfect job, I just used your plugin in one of my sites and thought I'd say a big thank you. Keep up the great work.
  259. Prashant Khanal
    June 2, 2009

    This is very useful stuff. I am using this plugin to show the text content loaded from the database. Is there any way that the component will adjust its height based on the text content being loaded on each slide. Currently the height of the component to hold the content seems to be fixed which can cause the content being clipped depending on its length.
  260. Sedat Kumcu
    June 3, 2009

    Thanks man. Great plug-in. It's super!
  261. level23design
    June 3, 2009

    This is a great plugin! Just what I was looking for on this one site I am working on!
  262. JC
    June 3, 2009

    Great plugin. Another vote for continuous sliding (e.g.: 1 > 2 > 3 > 1 > 2...) Does anyone know how to make this happen?
  263. jan korbel
    June 3, 2009

    Need to pause the animation on hover? Try inserting this on around line 96, right before function animate(dir,clicked)... $('#slider').hover( function() { animate("stop",true); }, function() { animate("stop",false); } ); Then insert this on line 176, right after ... },diff*options.speed+options.pause);... if(options.auto && dir=="stop" && !clicked){; timeout = setTimeout(function(){ animate("next",false); },options.pause); }; Probably not clean code at all, as I am no pro, but it works.
  264. Tom
    June 4, 2009

    Just a quick thanks to say I really appreciate the plugin - very easy to use. I've implemented it on a Ning powered site no problem. It's been getting great feedback from users. http://www.aclimateforchange.org/ Thanks for your great plugin!
  265. Carsten
    June 4, 2009

    @Nicolas I had the same problem. my nested divs made the last slidy empty, so i had to add an empty li-element on at the end to show all content. To hide the Next Button at that las and empty slide i just changed if(t==ts){ $("a","#"+options.nextId).hide(); $("a","#"+options.lastId).hide(); to if(t==(ts -1)){ $("a","#"+options.nextId).hide(); $("a","#"+options.lastId).hide(); that worked for me...just a hack, but working.... hope that can fix your issues, too! Carsten
  266. Kelli
    June 9, 2009

    This is great, thanks for posting all the options. I was wondering if there is a control for the slideshow to only go from left to right instead of right to left? Thanks, Kelli
  267. sivas
    June 10, 2009

    very good, thank you
  268. Michele
    June 10, 2009

    I try multiple slide and it works... great job for this script.. thanks
  269. Ismael
    June 11, 2009

    Lovely plugin!! Would like to rewind at the beggining feature. You know how are the clients. =/
  270. vlp
    June 11, 2009

    beautiful plugin, thanks a lot. I just tried to update jquery javascript and v1.5 stop working. Any possible updates to your library to work with newest version of jquery?
  271. countocram
    June 11, 2009

    very nice! I was impressed!
  272. Jeff L
    June 11, 2009

    Great plugin. One bit of feedback. If you don't have continuous set to true, and don't have controlsFade set to false, you end up with visible controls at the start and end of the slider that do nothing. I'd recommend adding this code to at least set a class on those controls so they can be styled to look disabled. <code> if (!options.controlsFade) { if(t==ts){ $("a","#"+options.nextId).addClass('disabled'); $("a","#"+options.lastId).addClass('disabled'); } else { $("a","#"+options.nextId).removeClass('disabled'); $("a","#"+options.lastId).removeClass('disabled'); }; if(t==0){ $("a","#"+options.prevId).addClass('disabled'); $("a","#"+options.firstId).addClass('disabled'); } else { $("a","#"+options.prevId).removeClass('disabled'); $("a","#"+options.firstId).removeClass('disabled'); }; } </code> I added that at line 147. Other than that, it worked great for me.
  273. moshe
    June 11, 2009

    to the kind fols who shared the stop-on-hover code: i am getting an error about 'dir' being undefined. also - is there a way to have a 'stop' (or pause...) button for this? Thanks for this great script!
  274. sp
    June 12, 2009

    i love this plugin. nice clean work. thank you
  275. Ryan Furtner
    June 13, 2009

    Im working on a word press theme and i need to add next/prev buttons to EACH SLIDE. I have been able to do this commenting out the javascript that adds the spans and adding them myself HOWEVER only the first buttons work. Why cant i have multiple next and previous buttons? http://www.furtzdesigns.com/multitheme/ That is the site im working on and i cant work out why it wont work!
  276. Ryan Furtner
    June 13, 2009

    Sorry just fixed that by using classes rather than ID's! Although I still have one problem, in IE i have noticed that you click through the slides a small 10-20px gap gets added to each li resulting in each slide being positioned lower as you move further through the slides. I cant work it out if anyone can offer some insight.
  277. adam
    June 13, 2009

    Ive got it working on everything apart from safari cant workout for the life of me why it wont check it out here I uses 22 on one single page for my portfolio section, works great but not in SAFARI. The next and previous buttons appear but just dont work when clicked and it seems the autoplay function is disabled http://www.adamatkinson.co.uk
  278. Dgwp
    June 14, 2009

    Hi all. I´m trying to get endless animation, as well as is describe above, but it is not working, anybody can help me?
  279. Jonathan
    June 15, 2009

    @adam If you figure it out please let me know because I am having the same problem. The Prev and Next buttons don't do anything when they are clicked on.
  280. Jonathan
    June 15, 2009

    Oh, I tried to use the JQuery 1.2.2 like someone stated above but it didn't work. There is not functionality in Chrome or Safari. Can somebody please help?
  281. Adam
    June 16, 2009

    @jonathan Yea if i figure it out I will certainly publish on here regards
  282. Courtney
    June 16, 2009

    Can't get my buttons to work, and the slide automatically starts with the third slide, not the first. Any ideas? I'm brand new to jQuery. Thanks! http://www.truenorthe.com/bright/home.html
  283. Mathew Smith
    June 16, 2009

    Has anyone got a version working with a caption under the slideshow that changes with each advance? Thanks!
  284. Hélio Correia
    June 17, 2009

    Patch for numbered pagination: 01. Edit easySlider.js 02. Add new defaults value var defaults = { ... pagination: '#pag a', .... } 03. Add new event for pages items: $(options.pagination).each(function(i){ $(this).bind('click', i, function(e){ e.preventDefault(); if (i > t || i < t) { t = i; animate('none', true); } }); }); 04. Add new markup: <ul id="pag"> <li><a href="#">Slide nr. 1</a></li> <li><a href="#">02</a></li> <ul>
  285. Hélio Correia
    June 17, 2009

    Sorry... my last hack has a bug Item 03 (FIX): $(options.pagination).each(function(i){ $(this).bind('click', i, function(e){ e.preventDefault(); if (i > t) { t = i-1; animate('next', true); } else if (i < t) { t = i+1; animate('prev', true); } }); });
  286. Verona
    June 17, 2009

    This is a really lovely solution, thank you. I have a few feature requests for further revisions! :) A play/pause for the autoslide would be outstanding. A thumbnail listing would also be ace. Clicking the thumb swaps the main slide and sliding continues from that point. Cheers!
  287. okey
    June 17, 2009

    Hey Thanx bunch, great slider u got there...
  288. manchurr
    June 18, 2009

    Anyone know how to solve Safari issue here.. firefox n IE works great.. help me plz.. thanks.
  289. Paul
    June 18, 2009

    Is there a way to set a cookie to remember which slide the user is currently on, so in case the user navigates away from the page and then back to it?
  290. Kerr McHale
    June 18, 2009

    Thanks so much for this lovely little script. So simple. I'm using multiple instances on one page, so one little change I made to the script, that might be worth considering if you release future versions is to include a "class name" variable for the Previous and Next buttons. In a use like mine, where there are multiple sliders, each with the same styling, it's much more efficient to just style one class that applies to all of them, rather than having to specify each separate ID each time a new instance is added. Even so, this is the only script that even came close to ease of use with multiple instances. ThanksQ!
  291. Dima
    June 19, 2009

    How to place 2,3,4 slider on one page? Thanks
  292. Pierre
    June 21, 2009

    Hya, such a great job you've done! :) Thanks a lot!! I have a suggestion : currently when the parameter is set to true, the behaviour of sliding is : pic1 -> pause -> pic2 -> pause -> pic3 -> pause -> pic2 -> pic1 -> pause -> pic2 -> pause -> .... It would be great to add a "Pause" on Pic2 when sliding is getting back to pic1 from pic3 :-)
  293. Michael
    June 22, 2009

    As mentioned above when I upload onto my server this plugin does not function correctly. I of course am viewing it in the same brower, totally stumped here. I tried clearing my firefox data/history out already, please help :)
  294. Michael
    June 22, 2009

    Update: FIX When I move my stylesheet to internal vs referencing it in an external file every thing works fine. Anyone know a way around this?
  295. Dima
    June 22, 2009

    Kerr McHale http://www.position-absolute.com/creation/slideshow/
  296. Danish
    June 22, 2009

    Great job! Truly tremendous, I really respect your work and love this plugin thank you for sharing this...
  297. Tom
    June 23, 2009

    Also having issues with IE 8. Buttons disappear each time they are clicked, effectively making the script only be able to go left once and right once.
  298. Hassel
    June 24, 2009

    Hey, anyone tested with Firefox 3.5? I tested a basic slider and dont work...
  299. Yanxerip
    June 24, 2009

    I love your job.. Thxs for share. From yanzen in Indonesia. GBU
  300. Ellis Benus
    June 24, 2009

    This is a great little plugin. However, if JavaScript is off, the the whole list of pictures shows up. I wrote a little function and just added a body onload call... Hopefully you will add this functionality in the future without my clunky way of doing it. put anywhere in the easySlider1.5.jpg /* * if javascript is not enabled only * the first image in the list will appear */ function showAllImgs() { var obj=document.getElementsByTagName('li'), o, i=0; while( o = obj[i++] ) { o.style.display='block'; } // end while } // end showAllImgs put in HTML <body onLoad="showAllImgs();">
  301. Matt van Wyk
    June 24, 2009

    For the basic text controls I added a div wrapper around the spans so it could be more easily styled. Perhaps a worthwhile addition for you to consider? Thanks for the nice script!
  302. jocuri noi
    June 26, 2009

    Hi, is there some update in the future?
  303. Sam
    June 26, 2009

    Sweet jQuery plugin, was very easy to incorporate.
  304. BrandonSetter
    June 26, 2009

    I there any way to go from left to right instead of right to left?
  305. Patz
    June 27, 2009

    Hey guys, scanning through the comments and see loads of people asking about continuous scroll. Check this one - http://bogojoker.com/easySlide/ It doesn't 'rewind' at the end...
  306. satish borkar
    June 30, 2009

    nice script ha ha ha................ thanks
  307. Ellis Benus
    June 30, 2009

    I am having the same issue as ESP on 18 Feb, 2009 wrote: Lightbox conflicts with easySlider 1.5 because of jQuery. (http://www.zimmerinteractive.com/tempdeucepub) I looking into the jQuery.noConflict option, but it does not work. Help.
  308. DynaGirl
    July 1, 2009

    Thanks for this very easy solution! Question? Anyone know how to center the images that I'm using within my div? Seems to align to the top/left.

Sorry, the comment form is closed at this time.