我有一个像这样的工作脚本:
jQuery(document).ready(function(){
$('.video-thumb img').bind('mouseover',function(){
var new = $(this).attr('src').replace(/default.jpg/,'1.jpg');
$(this).attr('src',new);
}).bind('mouseout',function(){
var default = $(this).attr('src').replace(/[0-9].jpg/,'default.jpg');
$(this).attr('src',default);
});
});
是的,你猜对了。它是为了定期更改 YouTube 的缩略图而设计的。但是,我不知道如何创建间隔。现在,它会将缩略图更改为 1.jpg,这是另一个缩略图,但接下来应该会在 1 秒内将图像更改为 2.jpg,依此类推。
整个片段可能应该从头开始编写。建议?
希望你理解:-D
EDIT:我从芬兰语单词更改了变量名称,我不使用它们。就在这个例子中。
马蒂·莱恩
new and default are 保留字 https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Reserved_Words%E2%80%8B%E2%80%8B在 JavaScript 中。你不能使用它们。
要创建间隔,您应该使用setInterval
:
setInterval(function() {
// do something
// ...
}, 1000); // <- 1000ms = 1s
[查看实际效果 http://jsbin.com/ekeku4/5/]
jQuery(document).ready(function() {
var timer, imgsrc, cnt = 0;
$('.video-thumb img').bind('mouseover', function() {
// if there is no timer
if (!timer) {
var $t = $(this);
// get the image src
imgsrc = $t.attr('src').replace('default.jpg','');
// start a new timer
timer = setInterval(function() {
// periodically change the src
$t.attr('src', imgsrc + (cnt+1) + ".jpg");
// and adjust the counter
cnt = ( cnt + 1 ) % 3; // 0, 1, 2
}, 1000); // <- 1000ms = 1s
}
}).bind('mouseout',function() {
// stop rotation
if (timer) {
clearInterval(timer);
timer = null;
}
// set the default img
$(this).attr('src', imgsrc + 'default.jpg');
});
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)