-1

jCoverflipを使用した画像のループに問題があります。この機能を追加する方法について誰か提案があれば、大いに感謝します。

4

1 に答える 1

0

@Mike setInterval を使用できます: http://jsfiddle.net/QmVFR/1 – @Oriol

jQuery( document ).ready( function(){
    jQuery( '#flip' ).jcoverflip({
      current: 2,
      beforeCss: function( el, container, offset ){
        return [
          $.jcoverflip.animationElement( el, { left: ( container.width( )/2 - 210 - 110*offset -10*offset )+'px', bottom: '20px' }, { } ),
          $.jcoverflip.animationElement( el.find( 'img' ), { width: Math.max(20,100-20*offset*offset) + 'px' }, {} )
        ];
      },
      afterCss: function( el, container, offset ){
        return [
          $.jcoverflip.animationElement( el, { left: ( container.width( )/2 + 110 + 110*offset + 10*offset)+'px', bottom: '20px' }, { } ),
          $.jcoverflip.animationElement( el.find( 'img' ), { width: Math.max(20,100-20*offset*offset) + 'px' }, {} )
        ];
      },
      currentCss: function( el, container ){
        jQuery('#flip>li.selected').removeClass('selected');
        el.addClass('selected');
        return [
          $.jcoverflip.animationElement( el, { left: ( container.width( )/2 - 75 )+'px', bottom: 0 }, { } ),
          $.jcoverflip.animationElement( el.find( 'img' ), { width: '150px' }, { } )
        ];
      },
      change: function(event, ui){
        jQuery('#scrollbar').slider('value', ui.to*25);
      }
    });


    jQuery('#scrollbar').slider({
      value: 50,
      stop: function(event, ui) {
        if(event.originalEvent) {
          var newVal = Math.round(ui.value/25);
          jQuery( '#flip' ).jcoverflip( 'current', newVal );
          jQuery('#scrollbar').slider('value', newVal*25);
        }
      }
    });
});

var timer=setInterval(next,3000);

function next(){
    var $next=$('#flip>li.selected').next('li');
    if(!$next.length){$next=$('#flip>li:first-child');}
    $next.click();
}
于 2012-08-31T17:02:27.967 に答える