How to Remove Pager Numbers From a jQuery Cycle
- 1). Open the HTML document containing the "head" tags for your website in a text or HTML editor. Look for a "script" tag containing a jQuery function similar to the following:
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade'
});
$('#s4').before('<div>').cycle({
fx: 'turnDown',
speed: 'fast',
timeout: 0,
pager: '#nav'
});
});
</script>
The selector defined in the "nav" or "pager" function corresponds with your jQuery Cycle container ID. In the above case, the selector is "s4." - 2). Remove the entire function containing the "pager" parameter. Each individual function block begins with "$" and ends with the closing "});" bracket. Make sure you only remove the "$('#').before" function. You should now have a "script" tag that is either empty or contains any remaining functions. The following example uses the same code as the last step, with the pager function removed:
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade'
});
});
</script> - 3). Save the file and preview your slideshow in a browser window to confirm the results. To remove any remaining navigation elements, return to the HTML document and add the following custom function just above the "</head>" tag:
<script type="text/javascript">
$.fn.cycle.defaults = {
next: null,
prev: null,
pager: null
};
</script>
These three options tell the plugin not to use anything for paging or navigation. The slideshow will now transition automatically unless a different pager behavior is set.