jquery.cycle实现有导航的幻灯片效果

jquery.cycle是个很好用的幻灯片插件

http://jquery.malsup.com/cycle/

但在官方的例子中却没有数字导航的例子，可能大部分人会认为它并不支持数字导航，今天刚好需要实现数字导航幻灯片效果，所以下载了个jquery.cycle看一下源代码，发现有个相关参数：

pager:   null,  // selector for element to use as pager container

 

之后我修改例子实验了一次

 

<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
		pager: '#pager',
		fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
	});
});
</script>
<div id="pager"></div>

之后id=pager的DIV就会出现数字导航，十分方便！

 

 

PS: 现在最新版是2.94，但这个版本的pager功能有问题，我所使用的版本是2.74