0

現在CSSを使用しているだけで、画像に単純な不透明度のフェードがあります。

それは正常に動作します..

CSS

ul#project li img {
opacity: 0.5;
transition: opacity .55s ease-in-out;
-moz-transition: opacity .55s ease-in-out;
-webkit-transition: opacity .55s ease-in-out;
}

ul#project li img:hover{ opacity: 1;}

HTML

<ul id="project" class="inner clearfix">
    <li class="tv-thumb 67">
        <a href="#" rel="link">
        <img class='large-image' src='image.jpg' />         
        </a>
    </li>
</ul>

jQueryを使用してアニメーションを一時停止または保持することはできますか?

これは可能です、私は本当にすべての1つの画像だけを使用したいと思っています..

ヒントをありがとう。

4

1 に答える 1

1

このようなものはどうですか:

CSS

 #project li a{
    opacity:0.5;
    }

js-1

$('#project li a').bind('mouseover',function(){

  $(this).fadeTo(0,1);

}).bind('mouseout',funcion(){

 $(this).delay(5000).fadeTo(0,0.5);

});

またはjs-2

 $('#project li a').on('mouseover',function(){

      $(this).fadeTo(0,1);

    });

 $('#project li a').on('mouseout',funcion(){

     $(this).delay(5000).fadeTo(0,0.5);

    });

またはjs-3

$('#project li a').on('mouseenter',function(){

      $(this).fadeTo(1500,1);

    });

$('#project li a').on('mouseleave',function(){

      $(this).delay(5000).fadeTo(1500,0.5);

    });

?

編集済み :css を jquery に変換する場合は、css を使用せずに jquery を使用します (jsfiddle では、css トランジションなどを削除できます)。その場合、イベントをメインの img 親にバインドして要素をチェックする必要があります。アウト: http://jsfiddle.net/pmf68/8/

編集2:

不透明度をジャンプする必要がない場合は、代わりにこれを試してくださいhttp://jsfiddle.net/pmf68/10/

于 2012-11-20T09:38:56.563 に答える