0

画像の処理中に、アニメーションを使用して現在の親指のサイズを縮小し、オーバーレイを適用しようとしています。オーバーレイは機能していますが、アニメーションが機能していないようです。これは、画像の検索方法と関係があると思います。

HTMLは次のとおりです。

<img id='loading' />
....

<tr>
    <td>
        <img id="5" src="<?php echo($url['url'])?>" style="height:120px;"/>
    </td>
    <td>
        <a href="#" id="img_5" class="test">Test Overlay</a></li>
    </td>
</tr>

CSS:

#loading { 
position: absolute; 
display: none;
background:transparent url(../../images/overlay.png) repeat top left;
}

現在のクリックイベントは次のようになります。

    $('.test').click(function(e) {
        e.preventDefault();

        var loading_img = $('#loading');

        var id = $(this).attr('id').substr(4);

        var img = $('#' + id);        
        var pos = img.offset();

        var $image  = $('#' + id).find('img:first');

        $image.stop(true)
          .animate({
            'width' :img.width() - 10 + 'px',
            'height':img.height() - 10 + 'px',
          },250);

        loading_img.show().css({
            width: img.width(),
            height: img.height(),
            left:pos.left, 
            top:pos.top
        });
    });      

私のアニメートコールで何が欠けているのか分かりますか?

4

1 に答える 1

1

HTML5 より前は、ID を数字で始めることはできませんでした。HTML5 doctype がないと、そのような ID を使用してもすべてのブラウザーで機能しない場合があります。

于 2012-07-12T19:51:55.370 に答える