posted on:August 4, 2009

Easy Slider 17 Numeric Navigation jQuery Slider


I got a lot of emails and feedback about my easySlider plugin, thank you all for that. However, I have to apologize to all of you who sent emails asking for a little help with implementation or small bug fixes. I simply don’t have the time to answer all of your emails. I wish I do.

What I am presenting you today is an easySlider update with 2 new features. When going through your feedback I noticed 2 feature suggestions appearing very often:

  • numeric navigation (as an alternative to next/previous buttons)
  • continuous scroll instead of jumping to the first (or last) slide

So, that’s what I implemented in this new version. Now you have the option to choose between classic previous/next navigation or to use a numeric “pagination” style navigation.

Also, your suggestion about continuous scroll made most sense, it is kind of annoying when you have many slides and have to wait for all of them to scroll back to the first one. I had to include it in this version.

Download easySlider 1.7

I suggest that you read about previous versions in order to understand better how it works:

easySlider version 1.0

easySlider version 1.5

Options

So, let’s go through all of the options. For your convenience I have written the options from previous version of this plugin, so you can have it all in one place. Here they are 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, 
numeric: 		false,
numericId: 		'controls'

prevId

Id attribute for "previous" button. Default value is "prevBtn".

prevText

Inner text for "previous" button. Default value is "Previous".

nextId

Id attribute for "next" button. Default value is "nextBtn".

nextText

Inner text for "next" button. Default value is "Next".

orientation

Sliding can be horizontal or vertical. Horizontal is default and if you want vertical set this to ‘vertical’.

speed

Animation speed in milliseconds, default value is 800.

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 automatic sliding. If you set it to true the sliding will automatically start and continue to perform untill user clicks one of the buttons.

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 simply continue showing all of the slides again with continuous motion. Combining this option with auto (both set to true) you’ll get endless animation.

numeric (NEW!)

If you set this option to true you will get numeric navigation instead of next/prev buttons. Plugin will create an ordered list just after the slider div. Ordered list will have the exact number of elements as the slider. Clicking on each of the number will make the animation jump to a certain slide.

numericId (NEW!)

This option defines id attribute for the ordered list. You should use this id to select and style the list with CSS.

Demos

I have 3 new demos here:

Continuous slide

Numeric navigation

Multiple slides

Here you go. If you have any more suggestions, please send them to me and I will consider of implementing them in the next plugin version!

Enjoyed the article?

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

DeliciousStumbleUpon RedditSubscribe

Comments (99 Comments)

  1. Mark
    August 4, 2009

    Awesomeness! Continuous slider rocks!

  2. Andris
    August 4, 2009

    That's absolutely awesome! Thanx for sharing it.

  3. Manu
    August 4, 2009

    Pretty nice updates, Alen! I like the numeric navigation and going to use it in my next template, but I don't know how to style the active number? Is there any id or class within the script defined?

  4. Michael Caputo
    August 4, 2009

    Thanks for this!

  5. cssglobe
    August 4, 2009

    @Manu: yes, the active numeric button is added a class "current". You can see how I styled the "current" button in my examples.

  6. Daveed Flexer
    August 4, 2009

    Great plug-in thanks. I was wondering if there is a way to paginate the "screens". IE update URL and have this new URL be such that when entered into browser window it opens appropriate "screen"/ I've made some attempts to customize, but without much success yet. DF

  7. existdissolve
    August 4, 2009

    Glad to see the numeric paging added to this great plug-in. I implemented something similar on my own, but glad to see it's been included. Here's the site I used it on: http://megandjason.com

  8. Austin Siewert
    August 4, 2009

    Thanks for sharing, awesome improvements!

  9. Manu
    August 4, 2009

    Thanks Allen, I already styled the current number! Is it possible, to remove the outside div (#slider) and set the id "slider" directly to the unordered list? Oh, and a packed version of that script would be fine!

  10. Ben
    August 4, 2009

    Great script, thank you! Is it allowed, to sell the easySlider within a html template (on themeforest)?

  11. Josiah Katz
    August 5, 2009

    I am trying to put a transparent PNG "frame" in front of the slider, and I am stumped on how to go about this. I've tried a couple different methods, but I'm just stumbling around. Any suggestions

  12. BBC Marketing
    August 5, 2009

    i love this plugin. but them i have to add a lot of images. and i want to show a random image on a specific page. Is there a tag or something to add in the code to achieve this? thanks

  13. Michael
    August 5, 2009

    Gorgeous script! But i stumble over a small bug and i hope i could get some help. If you load a great amount of pictures and not all images are preloaded before you hit the first time the next button. These Images will not load completely or they wont load at all. Any solution for this ? Thanks in advance! Michael

  14. Chame
    August 6, 2009

    Very nice. Can we have both numeric and button navigation at the same time?

  15. Pandamo
    August 6, 2009

    I thank: var w = $("li", obj).outerWidth(); better var w = $("li", obj).width(); ???

  16. Pandamo
    August 6, 2009

    BTW,IN the next update,can this control number of the visible "li"? This is only show one "li"....

  17. Cain
    August 6, 2009

    Hi, I would like to show show both Next/Prev buttons + numeric values? Any solution? Perhaps give buttons a show :false/true value as well.

  18. Cain
    August 6, 2009

    @Chame I did get the numeric and buttons to show by slightly modifying the JS. However ran into a bug; for example: lets say there are 5 images. If I click on the NUMERIC "#4" then click on the NEXT BTN, the image would keep scrolling to invisible space. Will take 10+ seconds before it reloads to #1 image. Perhaps the author has a better solution.

  19. Roger
    August 6, 2009

    Hi great slider! But when I try vertical true, it fails and flips on the demo download. Also it would be great if we could have the option for some nice fade in fade out. Like this: onBeforeSeek: function() { this.getItems().fadeTo(300, 0.2); }, // when seek ends resume items to full transparency onSeek: function() { this.getItems().fadeTo(300, 1); } Cheers!

  20. steve
    August 6, 2009

    great plugin but i'm having a problem loading an ajax page with this plugin on it. goto this page (http://sickman.info/v2/#home) and it works when first loading. click on another menu item, and then click on "steve sickman design" to go back to the home page. the slider div and ul get their width and height set to 0 and none of the slides show up. now on this page (http://sickman.info/v1/#home) the slider is manually started so it works when repeating the above steps any help is appreciated

  21. Kannan.BKN
    August 6, 2009

    hey its really cool, but i want to slide or scroll 4 thumb nail sized images at a time and if i click next, 1st image only should move and hide and other 3 should follow that and scroll left.. for info check http://books.rediff.com/ is this possible in this version plz reply asap.. thanks for this cool slider.

  22. Martin
    August 6, 2009

    Your work is really cool, i use it at http://www.trachtenstrip.de But i'd like to add some pause- and play-button (with active-status). Is this possible (or maybe a feature for next version)?

  23. Terry
    August 6, 2009

    Great to see how you have continued to improve the easySlider plugin!

  24. eastwood
    August 7, 2009

    Struggled with find a solution to having the slider stop when you mouseover it AND keep the buttons working. Here is what I came up with. Add this around line 141. Just before the animate function. $('#slider').mouseenter(function(){ animate("stop",true); }); Add this around line 158. You adding the case for when you call the stop dir. case "stop": t = t; break;

  25. Mr Ye
    August 8, 2009

    Great plug-in and great update - much appreciated Mr Alen :) Cheers

  26. Umar
    August 8, 2009

    hello, any one i want to use my keyboard arrow keys how can i use them. Thanks!

  27. Mathias
    August 9, 2009

    This is amazing, thanks! :)

  28. THE MOLITOR
    August 9, 2009

    This is simply amazing. I'm using this on my home page. I would be very interested in having the ability to display both numeric AND previous/next buttons.

  29. Michel S
    August 10, 2009

    Ohh, this is beautiful. Thank you for sharing.

  30. Nick Whitehouse
    August 10, 2009

    This is a great plugin! how about the option to display the image name also? I'm using PHP to automatically load every image from a folder into the <li></li> list, which makes it a very painless image viewer, just upload to the folder and sorted... although names/titles would add another dynamic!

  31. Matt Emery
    August 10, 2009

    An addition to Eastwood's code... Pause the slideshow on mouseover and resume the slideshow on mouseout. Add this around line 141. Just before the animate function. $('#slider').mouseenter(function(){ animate("stop",true); }); $('#slider').mouseleave(function(){ animate("next",true); }); Add this around line 158. You adding the case for when you call the stop dir. case "stop": t = t; break;

  32. eric
    August 11, 2009

    I've used this in a few projects, so thanks. I was thinking about putting a counter like "Slide 1/5" near the back and prev buttons. Maybe another option to include in your next version?

  33. kelly
    August 12, 2009

    Great script! Nice and easy to customize. Thanks!

  34. Cameron
    August 13, 2009

    If you have a theme with more than one instance of jquery being called, it won't work in wordpress.

  35. Mohsin Rafique
    August 13, 2009

    Great Work. I really appriciate your effort. Well i have a query regarding to Easy Slider and it is about is it possible to control the opacity of the slider image. I mean onload the loade images in slide show have 80% opacity and when mouse move over the slider image, it's opacity becomes 100%. FOr reference what feature i am looking in your code, you can see from this URL http://www.andrewplummer.com/portfolio/ I hope i will have a positive response from your end.

  36. Leannekera
    August 14, 2009

    Wonderful script, thank you so much!

  37. Karar A.
    August 14, 2009

    Amazing and nice , you saved me alot of time good job mate and Thank you very much.

  38. John McMullen
    August 14, 2009

    Taking from Eastwood and Matt, this should be implemented in the next release: Add an additional default property around line 57 (end of the list): hoverPause: false (be sure to add the comma to the property above it) Around line 141 add this entire block of code: if (options.hoverPause === true){ $('#slider').mouseenter(function(){ animate("stop",true); }); $('#slider').mouseleave(function(){ animate("next",true); }); } Then add the case "stop" as mentioned above, copied here: case "stop": t = t; break; This way it integrates into the plugin and you can turn it on/off.

  39. John McMullen
    August 14, 2009

    Sorry to bog up the comments, but a slight correction on my previous post. Replace the if statement with this so it'll recognize whether or not you have it sent to continuously change: if (options.hoverPause){ $('#slider').mouseenter(function(){ animate("stop",true); }); $('#slider').mouseleave(function(){ if (options.continuous){ animate("next",false); } else { animate("next",true); } }); };

  40. zac
    August 14, 2009

    HI, great plug-in, thanks for sharing! I have noticed a few requesting this feature and I was wondering if anyone was able to implement it. That is, when the user clicks to move the slider manually it loses its auto play ability. Has anyone figured out a way to have that come back instead of switching to completely manual ?

  41. sally
    August 15, 2009

    how can i change the numbes buttons to text I want to use this slider for boxes of information eg. How When Where

  42. Robert
    August 17, 2009

    Hi, Are there problems with Lightbox and Easyslider together in one page? Thanks,

  43. Matt Emery
    August 17, 2009

    Thanks for the update John, that works much better.

  44. Jeremy Karney
    August 17, 2009

    Is there any way to make custom elements control the slider? See the 4 boxes on the grey ribbon. I want the slider to advance to the corresponding box upon clicking one of those boxes. I tried to use the same tags as the numerical navigation, but it did not pick it up, I am assuming because it is outside of the slider div. Here is the site: http://thenearsky.com/sb/

  45. Luc Pestille
    August 17, 2009

    One bug / feature I've found that could do with being an option - when you have numeric navigation set up, clicking on one of the links takes you to that item, but the slideshow then stops forever. I'd like it to be able to carry on with the animation, after the pause... Thanks - great lightweight slider otherwise!

  46. Felipe Lima
    August 18, 2009

    Hi! I needed to consume events for image change in the slider, so I changed a bit the code to add this functionality. In the function adjust(), add the following line to its third line: options.onChange(t); Then, call the slider with an additional onChange option: $("#slider").easySlider({ (...) onChange: onChangeImg }); function onChangeImg(index) { /* do something on image change */}; The function receives the zero-based image index. Maybe you'll want to add this functionality to the next version, since it's fairly small! Thanks and keep the nice work!!! Felipe

  47. Edith
    August 18, 2009

    Love the slideshow! Also works well with text overlays. In HTML: <li><a href=""><img src="images/slide.jpg" alt="" /> <span> text goes here </span> </a> </li> In CSS: #slider li span {display: block; width: Xpx; height:40px; background: transparent url(../images/slide.png) repeat 0 0; margin-top: -40px; position: relative; } And voila, you have a text overlay which slides with the images. Many thanks, Edith

  48. Arjun Mehta
    August 18, 2009

    Thanks for your development on this! I noticed a bug for the vertical option on line 134 of the js file: $("ul",obj).css("margin-left",(t*h*-1)); should be: $("ul",obj).css("margin-top",(t*h*-1)); I was perplexed as to why my list was sliding over to the left! hah.

  49. Stephen
    August 19, 2009

    Refrain from wrapping or using align="center" on the slider div because it stops the slider moving to the next image in Safari and Chrome. A solution to centering the content if you have different size images would be in the CSS: #slider ,#slider2{ text-align: center; }

  50. Ian
    August 20, 2009

    Any possibility of releasing two different files, one with the MIT License included at the beginning and one referencing the GPL license? None of these are included in the zip file, just referenced in the source code.

  51. Mike
    August 20, 2009

    Love the script, however when I use it with supersleight (the jquery plugin for making .png's display with transparency in IE6) the slides in the easySlider aren't hidden, the .png's are visible on upcoming slides. Any help would be much appreciated!

  52. marujo
    August 20, 2009

    great job! how can i implement this tool on wordpress? its a plugin? its very cool. thanks

  53. Jason
    August 21, 2009

    Nice script here. It offers tons of variation in a slider. Most sliders are just scrolling through lists without controls. Controls make this stand apart from the rest. I have been implementing this scroller into wordpress, I'll share the code with you when I get done, I have been trying to use small thumbnails to navigate through the list, but am not quite sure how you are getting the value for each list item. When you call NEXT do you use child methods to navigate through the list? I tried adding a custom ID to each item, but to no avail... What I am trying to do is something to this effect: http://www.fuseboxtheatre.com/

  54. PattyR
    August 21, 2009

    When attempting to create multiple sliders on one page with both sliders using numeric controls, the numeric controls all lump together in one ordered list. It is creating a <ol id="controls"> for each slider, but the actual controls only show up in the first ordered list on the page. This appears to be an issue with the javascript, not the css. Unless I am missing something (it has been a long day).

  55. Paolo
    August 21, 2009

    Very good and simple plugin. Is possibile to use numeric with simple next/prev button ?

  56. Chris
    August 21, 2009

    In reply to ParryR. I also had this problem. The solution is to define the navigationId in your Jquery document ready call. $(document).ready(function(){ $("#slider1").easySlider({ continuous: true, numeric: true }); $("#slider2").easySlider({ continuous: true, numeric: true, numericId: 'control2' }); }); Whatever you call your second slider numericId you'll need to duplicate your CSS for it. Hope that makes sense,

  57. Pierre
    August 21, 2009

    Great Job!! A idea for the next release : the possibility to fit numeric controls above the slider ;-)

  58. PattyR
    August 21, 2009

    Makes perfect sense, thanks Chris.

  59. gerafik
    August 21, 2009

    hello How to show images side by side without border and white spaces - when I have small pictures, smaller than container dimension?? (I want to see others neighbouring images near selected images) thanks for help

  60. Pierre
    August 21, 2009

    It seems that vertical and continuous mode doesn't work correctly... It would nice if the numeric control choice the shortest way between 2 slides (example : slide 9 is active, I click on 2 -> it should go on slide 1 then slide 2, not get back on slide 8, 7, ... til slide 2) Great job anyway :-)

  61. wedhaaf
    August 23, 2009

    I love it. But can it display a caption inside of each image?

  62. Dean
    August 24, 2009

    @gerafik: You should be able to change the overflow setting on your container and have it show other slides, I think that will only show slides AFTER the active one though, You will probably need to edit the js to alter that behaviour... Amazing work on this plugin it's really easy to use and works perfectly (apart from the vertical setting!!) I love it! Thanks for sharing.

  63. gerafik
    August 24, 2009

    @Dean: Thanks for help, but it still doesn't work. Overflow setting doeasn't matter for showing, I can delete all, or change for 'visible' or 'auto' - and it still the same, but... I check that if I delete settings "dimension height" in "#slider li, #slider2 li" It show me correctly photos - side by side, but It wrong calculate right photo in right place, there is some bug... maybe in js. Pleas check: http://www.gerafik.pl/test/test.php Any idea for solution...?

  64. Ollie Wells
    August 24, 2009

    @Chame @Cain and to the author! I too have managed to get both numbers and navigation arrows showing with some hacking of the code. Is there a nicer way of doing this? Im having the same issues as Cain where it scrolls off the page then returns 10 seconds or so later to the first image. Help!! :)

  65. Fernando
    August 24, 2009

    Is possible to use texts instead of numbers (in numeric navegation) ? Thanks a lot

  66. Chris
    August 24, 2009

    @Chame @Cain @Oliie Wells and to the author! I found a solution for our problem. Try to modify the animate-function from "default: t = dir;break;" to "default:t = parseInt(dir);break;" Now it works fine with numbers and navigation arrows together.

  67. James
    August 25, 2009

    I am trying to use this but having a few issues: 1) I need it to scroll vertically, but when I set it to continuous at the same time I have problems... seems to skip a slide or add in a blank one... this only happens when both are set to true... 2) I want the buttons to be placed at the top and bottom of the slide as opposed to the left and right... how can I get them to line up that way as if they look like up and down arrows... I understand I will have to change the arrow graphics... Great script... and thanks to Arjun Mehta for the bug fix.

  68. Ollie Wells
    August 25, 2009

    @Chris (on 24 Aug, 2009). Sir, you are a genius. Awesome!

  69. Ollie Wells
    August 25, 2009

    Does anyone know how to add some easing to the animation ?

  70. Ollie Wells
    August 25, 2009

    If anyone wants to see it in action, http://www.twentysixtwelve.co.uk/ :)

  71. Tommy Arnold
    August 25, 2009

    I have been looking for this for hours, you should try and put some keywords like javascript image slider, left right image slider, simple image rotator so google can find you.

  72. Anita
    August 26, 2009

    Easyslider works very well with text and html inside the slides, as well as images. The only thing to be wary of is using lists inside a slide - these seem to add extra empty slides to the end of the list. (Actually they just increase the width of the list so that it looks as though there are empty slides.)

  73. Andrew Philpott
    August 26, 2009

    thanks for this awesome plugin! i had been trying to use similar ones for a while, but found that yours is by far the easiest.

  74. Jamie
    August 26, 2009

    Such a great image slider and so easy to use. Thank you.

  75. Cain
    August 26, 2009

    Anyway to not load the hidden images until its click to?

  76. Kyle Florence
    August 26, 2009

    Thank you for this, it is much cleaner and better organized than the Coda Slider.

  77. Kyle Florence
    August 26, 2009

    Some suggestions: - Make it possible to use both the numeric navigation and the previous/next buttons (this is an easy fix). - Add an easy way to switch between putting the navigation items above or below the slider content (should also be easy).

  78. Kyle Florence
    August 27, 2009

    Since these suggestions were rather simple to do, I've gone ahead and edited version 1.7 to add these new features (along with the option for custom easing animations using the jquery easing plugin). Also removed the javascript:void(0) references in the link and replaced them with anchors (#) and had the click events return false (better practice). You can download it here: http://archive.kflorence.com/projects/easySlider/jquery.easySlider-1.8.js

  79. Steve
    August 27, 2009

    Thanks for a great slider. I got everything working, but I have one problem. This is probably a stupid question, but any help would be appreciated. When I click on the next or previous button, there is blue dotted line that forms around the button and across the page. How do I get rid of this blue dotted line?

  80. web ink
    August 27, 2009

    Is there anyway to make the slider images to move from left to right rather than right to left? I have tried a few things but they failed miserably with the slides jumping back and forth. If not, thats fine but it would be cool to be able to make the slide go in either horizontal direction. Lastly, thankyou for making such a good and easy to use slider script available.

  81. Kyle Florence
    August 27, 2009

    Vertical bugs fixed here: http://archive.kflorence.com/projects/easySlider/jquery.easySlider-kf.js

  82. Helen P
    August 27, 2009

    This is a fantastic script so easy to implement Thank you. Is there a way to restart the autoplay after a next/previous button has been clicked?

  83. Ryan G
    August 27, 2009

    Has anyone else (besides me) found that if the slider div is inside a div that starts out as "display:none;" (such as a container div that is only displayed after the click of a button), then the ul in the slider doesn't grab the widths of the list items? And so it doesn't work. It seems to me like this part - $("ul",obj).css('width',s*w); - is being prevented from working... and that the display:none style is the culprit. However, it'd be rad if someone smarter than me could replicate/verify/fix it!

  84. Becca P
    August 27, 2009

    Thanks so much for this slider! It was really easy to integrate and the configurable options are just what I needed. @John McMullen - Thanks for the added pause-on-hover effect - also exactly what I needed!!!

  85. Matthew D
    August 27, 2009

    Thanks for this, I made a slight modification that others may find useful, it uses the size of the div element rather than the individual li's, this is useful for when you want content to slide in and slide out without others li's showing regardless of dynamic width. Modify the starting of this.each(function(){ to look like the following to achieve this: var obj = $(this); $('li',obj).each(function() { $(this).width($(obj).width()); }); var s = $("li", obj).length; var w = $(obj).width(); var h = $("li", obj).height(); Technically the var w = $(obj)...... line isn't a required change but it is a little quicker as there's less DOM traversal.

  86. Ryan G
    August 28, 2009

    Matthew, that seems along the lines of what I need to do to fix my site. But it didn't fix my problem (I've since reverted back to the original code). For some reason the slider div's height and width is being overwritten in the javascript to be "width: 0px; height: 0px;" I have it working here: http://www.blueskiesabove.us/pgrls/foo2.html but once I add onclick behavior it stops working: http://www.blueskiesabove.us/pgrls/foo.html Any chance you could look at that? I'm not proud to say that I've been working on this for a couple weeks... I've tried a few different ways of coding the onclick. The current version seems like a slight improvement. But it's still not there. I think the slider div is still being affected by how the "butthead" div starts out as display:none;.... you can email me at master.cob gmail, if you feel like helping ;) thanks.

  87. Vic
    August 28, 2009

    Great job. Thank You :)

  88. Marc
    August 28, 2009

    Is there a way to create a button manually outside the slider that can cause the slider to go to a particular slide (li) Sorry if this has been asked before

  89. Kyle Florence
    August 28, 2009

    The file below has a fix for nested list items -- no longer causes everything to break when used within the normal list structure. http://archive.kflorence.com/projects/easySlider/jquery.easySlider-kf.js

  90. Kyle Florence
    August 28, 2009

    Full list of new features in my modified version: - Fixed nested lists breaking the plugin. - Removed javascript:void(0) calls from anchor tags (replaced with # and return false;) - Fixed vertical sliding bugs when continuous is set to true - Fixed vertical sliding bug that caused vertical slides to shift to the left - Added the option to have both numeric navigation and first/previous/next/last buttons at the same time - Added an option that allows the controls to be placed above or below the main content area - Added the option for custom easing animations The link to download it is here: http://archive.kflorence.com/projects/easySlider/jquery.easySlider-kf.js

  91. Markus
    August 30, 2009

    Hello, at first i have to say, the slider is a big ones ;-) i have a question. is it posibly to write a word (example hello, test, anyone, ..) and not the number (01, 02, 03,). thanks for your help and sorry for my bad englisch! greets from austria markus

  92. Rado R.
    August 31, 2009

    This is the coolest and easiest plugins I've ever seen man! This plugin rocks!!! Keep it that way! Greetz! Rado R.

  93. Des
    September 1, 2009

    Great plugin - loving it so far. It would be great to add some kind of callback functionality . . . onChange, do something, etc. I'll be using it on many projects!!!

  94. Willem
    September 1, 2009

    Hi, I was wondering how to position the numeric area right instead of left. Can someone help me with this? Thanks! Willem

  95. Ramiro
    September 2, 2009

    Nice Plug! How can we customize the numeric navigation to show text instead of numbers. Thanks in advanced.

  96. Jamie
    September 2, 2009

    Hi, Wow this really is such a great script. So easy to use and looks great. Would just like to know if someone can help me. The script looks great on all the browsers except for ie 7 and lower. For some reason on ie 7 and ie 6 the images dont display as a slider but rather all of them show one on top of the other. Is there any reason for this? Thanx Jamie

  97. cester
    September 2, 2009

    It is possible to insert a textlink as numeric navigation? For Example: Step 1: Intro Steb 2: Product ..... Thanks!

  98. Jakob
    September 3, 2009

    I followed your all your steps. The only thing is the buttons dont work. what is wrong?

  99. Oren
    September 3, 2009

    a great tool, I am using it with RTL support. thereare some modification do to: when I use the following head tag the tool is not working <html xmlns="http://www.w3.org/1999/xhtml" dir="rtl" lang="he"> to make it work, i changed the the slider div: <div id="slider" dir="ltr"> and it is working very good, thanks for sharing.

Sorry, the comment form is closed at this time.