0

クリックすると回転を停止するようにこのウィジェットを変更するのに問題があります。この機能を追加する方法を知っている人はいますか? どんな助けでも大歓迎です。

前もって感謝します。

  • マイク

ウィジェットへのリンクは次のとおりです。

http://stromasys.29kdev.com/jcoverflip/

Javascript は次のとおりです。

    <script>

    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,5000);

function next(){
    var $next=$('#flip>li.selected').next('li');
    if(!$next.length){$next=$('#flip>li:first-child');}
    $next.click();
}

    </script>
4

1 に答える 1

0

イベント ハンドラーを任意の DOM 要素にアタッチするだけです。

$("a.stop").click(function(){
    clearInterval(timer);
    return false;
});

同じHTMLは次のとおりです。

<a href="#" class="stop">Stop</a>

画像に添付したい場合、これはコードです：

$(".ui-jcoverflip--item img").click(function(){
    clearInterval(timer);
    return false;
});
于 2012-09-18T13:27:09.097 に答える