gpt4 book ai didi

javascript - jQuery Orbit - 如何制作随机幻灯片?

转载 作者:行者123 更新时间:2023-11-29 22:21:33 29 4
gpt4 key购买 nike

我为我的网站找到了一个很棒的幻灯片。

当页面加载时,第一张图片出现在幻灯片中。

我希望幻灯片在页面加载时随机显示一些图片。

JavaScript 代码:

 (function($) {
$.fn.orbit = function(options) {

var defaults = {
animation: 'fade',
animationSpeed: 800,
timer: false,
advanceSpeed: 4000,
pauseOnHover: false,
startClockOnMouseOut: false,
startClockOnMouseOutAfter: 1000,
directionalNav: true,
captions: true,
captionAnimation: 'fade',
captionAnimationSpeed: 800,
bullets: false,
bulletThumbs: false,
bulletThumbLocation: '',
afterSlideChange: function(){}
};

有什么想法吗?

最佳答案

所以;开放源代码 ORBIT 对象设置添加随机默认 false:

defaults: {                                                                 
animation: 'horizontal-push',
animationSpeed: 600, // how fast animtions are
timer: true, // true or false to have the timer
advanceSpeed: 4000, // if timer is enabled, time between transitions
pauseOnHover: false, // if you hover pauses the slider
startClockOnMouseOut: false, // if clock should start on MouseOut
startClockOnMouseOutAfter: 1000,
directionalNav: true, // manual advancing directional navs
captions: true, // do you want captions?
captionAnimation: 'fade', // fade, slideOpen, none
captionAnimationSpeed: 600, // if so how quickly should they animate in
bullets: false,
bulletThumbs: false, // thumbnails for the bullets
bulletThumbLocation: '', // location from this file where thumbs will be
afterSlideChange: $.noop, // empty function
fluid: false,
centerBullets: true,

/////////////////////////// add Line
random: false, // or true
////////////////////////////

},

在 ORBIT 对象 {loaded} 方法之后添加到 if (options.random) then Random:

loaded: function () {                                                       
this.$element
.addClass('orbit')
.css({width: '1px', height: '1px'});

this.setDimentionsFromLargestSlide();
this.updateOptionsIfOnlyOneSlide();
this.setupFirstSlide();

if (this.options.timer) {
this.setupTimer();
this.startClock();
}

if (this.options.captions) {
this.setupCaptions();
}

if (this.options.directionalNav) {
this.setupDirectionalNav();
}

if (this.options.bullets) {
this.setupBulletNav();
this.setActiveBullet();
}


//////////////////////////////// add Line
if (this.options.random)
this.shift(this.Random.__init__());
/////////////////////////////////////

},

之后;添加 ORBIT 对象新方法 {Random}

    Random: {                                                                      

__init__: function() {

return this.math();
},

math: function() {
var bullets_count = (jQuery(".orbit-bullets li").length -1);

return (Math.floor(Math.random() * (bullets_count - 0 + 1)));
}
},

放轻松..

关于javascript - jQuery Orbit - 如何制作随机幻灯片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12177967/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com