Pager active item broken?

Mar 29, 2012 at 9:10 PM

It appears that the active pager item isn't working properly because there are two script tags inside the ordered list that is used for the pager. In the Chrome dev tool you can watch the script tags get the activeSlide class assigned to them. If you have three images you are going through, when the third is displayed you will see the pager highlight the first item. This does not appear to be browser specific. Can anyone else confirm this or know a workaround?

Apr 2, 2012 at 5:49 PM

I am having the exact same problem... the third slide highlights the first pager item, the fourth slide highlights the second pager item. Nothing I have tried works. Any advise? Thanks!

May 4, 2012 at 7:34 AM
This discussion has been copied to a work item. Click here to go to the work item and continue the discussion.
May 17, 2012 at 10:20 PM

I had this same problem but I fixed it by adding this bit of jquery after the content pane that my content slider is in.

$(function () {
	$('.wnsSliderPager script').remove();
	$('.wnsSliderPager li').first().addClass("activeSlide");


This removes the two script tags after the content slider has loaded and everything seems to be working for me.

May 18, 2012 at 2:22 AM

cdorge:  Thanks for posting the workaround.  :)

May 18, 2012 at 4:07 PM

Thanks for this post - but what exactly do you mean by "after the content pane"?

May 18, 2012 at 6:36 PM

All you need to do is place the jquery in your skin but after the content slider.

May 18, 2012 at 7:06 PM

cool - thanks for the clarification on that

May 19, 2012 at 6:34 PM

Thanks a lot, that solved my problem too...


Jun 12, 2012 at 10:42 PM


does it work on IE for you? Using this technique the pager have disappeared on IE8/9. It is very hard to debug as the entire <ol> tag appears to be gone under IE...
I know it is nonsense, the source code is the source code. Something weird going on.


Feb 24, 2013 at 9:02 AM
lwbrown wrote:
Thanks for this post - but what exactly do you mean by "after the content pane"?
You can paste the following into the footer of the module by selecting settings from the modules action menu.

<script type="text/javascript"> $(document).ready(function() { $(".wnsSliderPager li").prependTo(".wnsSliderPager"); $(".wnsSliderPager li:first-child").addClass("activeSlide"); }); </script>
Nov 26, 2013 at 8:57 PM
How would you get "activeSlide" to 'move' with each transition?