-2

マウスが上にあるときにビデオのサムを変更したいだけです...

私はこのスクリプトを作成しました：

var thumb=0;
var num_thumbs = 11;
$("#<?=($video->id) ?>_video").hover(function(){
open_hover_div[<?=($video->id) ?>]=true;
var timer = setTimeout(function(){

if (open_hover_div[<?=($video->id) ?>]==true) {$(".over_<?=($video->id) ?>").fadeOut(200);$(".overTxt_<?=($video->id) ?>").delay(201).fadeIn();}}

, 1000);

var thumbs = setTimeout(function(){if (open_hover_div[<?=($video->id) ?>]==true) {
if ( thumb > (num_thumbs-1) ) {thumb=0;}
$("#<?=($video->id) ?>_video").css('background-image','url(images/video/<?=$video->id?>/'+thumb+'.jpg)');
thumb++;
}}
, 1000);

});

$("#<?=($video->id) ?>_video").mouseleave(function(){
thumb=0;
open_hover_div[<?=($video->id) ?>]=false; $(".over_<?=($video->id) ?>").fadeIn();$(".overTxt_<?=($video->id) ?>").hide();
$("#<?=($video->id) ?>_video").css('background-image','url(images/video/<?=$video->id?>.png)');
});

問題はこの部分にあります：

var thumbs = setTimeout(function(){
if (open_hover_div[id) ?>]==true) {
if ( thumb > (num_thumbs-1) ) {thumb=0;}
$("#id) ?>_video").css('background-image','url(images/video/id?>/'+thumb+'.jpg)');
thumb++;
}}
, 1000);

マウスを上に置くと、サイクリングの変更ではなく、変更が 1 つだけ表示されます...

スクリプトは次のことを行う必要があります。

  • 以上で、XXX ミリ秒ごとに 1.jpg、2.jpg などを表示します。
  • 最後の画像に到達する (例: 11.jpg、0.jpg から再開)
  • マウスを離すと、マウスを再度ホバーすると自動的に 0.jpg に再起動します

私の問題について明確にしたいと思っています:(

4

1 に答える 1

0

setIntervalの代わりに使用しsetTimeoutます。

var thumbs = setInterval(function(){ // ......

次に、mouseleaveイベントで、次のように間隔をクリアする必要があります。

clearInterval(thumbs);
thumbs = null;
于 2013-07-11T11:21:53.520 に答える