jquery帶進度條的焦點圖片特效插件

帶進度條的焦點圖片特效jquery插件,圖片做成很大時看上去能夠實現全屏的效果,進度條上還帶有一個小圖標跟隨焦點滑動,不像普通的焦點圖特效只是當前的焦點的樣式與其餘的不同而已沒有特別之處,而這個小圖標的動畫大大提升了這個特效的可觀賞性。我就是被這個效果所吸引的,再去花時候從網上把它整理出來的。 html

下面讓咱們來看看它有哪些參數能夠設置,因爲全是英文的,水平不怎麼樣只能理解個大概,具體功能只有試過才知道了。 jquery

 


preload: false, // boolean, 設置爲true時圖片優先加載
		preloadImage: '/templates/images/loading.gif', // 圖片載入時loading圖片地址
		container: 'slides_container', // string, 容器ID名
		generateNextPrev: false, // 生成上一頁與下一頁按鈕
		next: 'next', // string, 下一頁class樣式名
		prev: 'prev', // string, 上一頁按鈕class樣式名
pagination: true, // boolean, If you're not using pagination you can set to false, but don't have to
		generatePagination: true, // boolean, Auto generate pagination
		prependPagination: false, // boolean, prepend pagination
		paginationClass: 'pagination', // string, Class name for pagination
		currentClass: 'current', // string, 當前焦點的classname
		fadeSpeed: 350, // number, 切換的速度值
		fadeEasing: 'swing', // string, 
		slideSpeed: 350, // number, Set the speed of the sliding animation in milliseconds
		slideEasing: '', // string, 
		start: 1, // number, Set the speed of the sliding animation in milliseconds
		effect: 'slide', // string, '[next/prev], [pagination]', e.g. 'slide, fade' or simply 'fade' for both
		crossfade: false, // boolean, Crossfade images in a image based slideshow
		randomize: false, // boolean, Set to true to randomize slides
		play: 0, // number, 自動播放時間間隔
		pause: 0, // number, Pause slideshow on click of next/prev or pagination. A positive number will set to true and be the time of pause in milliseconds
		hoverPause: false, // boolean, 鼠標通過時是否暫停
		autoHeight: false, // boolean, Set to true to auto adjust height
		autoHeightSpeed: 350, // number, Set auto height animation time in milliseconds
		bigTarget: false, // boolean, Set to true and the whole slide will link to next slide on click
		animationStart: function(){}, // Function called at the start of animation
		animationComplete: function(){}, // Function called at the completion of animation
		slidesLoaded: function() {} // Function is called when slides is fully loaded


對主要的參數我都做了中文的說明,其餘一些都不經常使用,有興趣的朋友能夠去試試。這效果然的很不錯。 dom

相關文章
相關標籤/搜索