Story List - 打字效果文字一个个显示

下载地址

主要js代码var StoryList = { containerObject: {}, storyListObject: {}, storyListAttribute: "data-story-list", storyListTargetObject: {}, storyListTarget: "ul > li", storyListTargetAttribute: "data-story-list-target", storyListTextList: [], storyListCharactersInterval: 25, storyListCoolDown: 1500, storyListExitMessageAttribute: "data-story-list-exit-message", storyListExitMessage: "...", Init: function(e) { this.containerObject = e; this._setupSettings(); this._setInformation(); this.startStoryCycle() }, _setupSettings: function() { this.storyListObject = this.containerObject.find(this.containerObject.attr(this.storyListAttribute)); this.storyListTarget = typeof this.containerObject.attr(this.storyListTargetAttribute) === "undefined" ? this.storyListTarget: this.containerObject.attr(this.storyListTargetAttribute); this.storyListExitMessage = typeof this.containerObject.attr(this.storyListExitMessageAttribute) === "undefined" ? this.storyListExitMessage: this.containerObject.attr(this.storyListExitMessageAttribute); this.storyListTargetObject = this.containerObject.find(this.storyListTarget) }, _setInformation: function() { var e = this; this.storyListTargetObject.each(function() { e.storyListTextList[e.storyListTextList.length] = jQuery(this).text() }) }, startStoryCycle: function() { this.storyListTargetObject.hide(); this.displayStory(this.storyListTextList[0], this, "storyCycleResponse", { textIndex: 0 }) }, storyCycleResponse: function(e) { var t = e.textIndex + 1; if (this.storyListTextList.length + 1 == t) this.displayStory(this.storyListExitMessage); else { this.storyListTargetObject.eq(e.textIndex).fadeIn("slow"); this.displayStory(this.storyListTextList[t], this, "storyCycleResponse", { textIndex: t }) } }, displayStory: function(e, t, n, r) { if (typeof e === "undefined") e = this.storyListExitMessage; if (this.storyListObject.html() == e) return; this.storyListObject.html(""); var i = this, s = 0, o = setInterval(function() { if (typeof e === "undefined") clearInterval(o); if (s == e.length) { clearInterval(o); setTimeout(function() { if (typeof t !== "undefined" && typeof n !== "undefined") t[n].call(t, r) }, i.storyListCoolDown) } else { i.storyListObject.append(e[s]); s++ } }, this.storyListCharactersInterval) }};jQuery(document).ready(function() { jQuery("[data-story-list]").each(function() { var e = {}; e = jQuery.extend(1, {}, StoryList); e.Init(jQuery(this)) })})

2285_9277d2316089c3c7754241fd147b9c03.png

dd:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值