16

div をフェードインしようとしています。画面上に数秒間保持してから、フェードアウトします。問題は、遅延を約 10 秒に設定しても、期待どおりに画面に表示されないことです。画面に表示されるのは短時間だけです。私は多くの投稿を読み、settimeout などの多くのことを試しましたが、どこにも速く行きません。

これが私のスクリプトです：

<script type="text/javascript">
    function pageLoad() {
    $("[id*=lnkSelect]").live("click", function () {
    var price = $("#price").html($(".prodprice", $(this).closest('tr').prev().children   ('td.prodpricelabel')).html());
    var code = $("#code").html($(".prodcode", $(this).closest('tr').prev().prev().children ('td.prodcodelabel')).html());
    //Build the new HTML
    $(code).prepend("<br/>Item: ");
    $(code).append("<br/>Has been<br/>added to your cart.<br/>Price: ");
    $(".tooltipleft").html(code); //Set the new HTML
    $(".tooltipleft").append(price);
    $(".tooltipleft").fadeIn('slow').delay(5000).fadeOut('slow');
    });
    };
</script>

そのため、html から製品コードと価格を取得し、div 内の html を変更してから、アイテムがショッピング カートに追加されたという通知としてこれをフェードインします。

これは、フェードインしたい div です。

<div class="tooltipleft" id="tooltip">
    <span id="code"></span><span id="price"></span>
</div>

およびグリッド内のボタン:

<asp:ImageButton ID="lnkSelect" runat="server" ImageUrl="~/Buttons/add_to_cart.png"
    AlternateText="Add To Cart" CommandArgument='<%# Eval("ProductID") %>' CommandName="Add"
    ImageAlign="Right" />
4

2 に答える 2

21

次のようにします: http://jsfiddle.net/LJsNG/1/

$(function () {
  $('.tooltipleft').fadeIn('slow', function () {
    $(this).delay(5000).fadeOut('slow');
  });
});
于 2013-01-13T14:47:25.190 に答える
17

機能するかどうかを確認するには、fadeIn と fadeOut の代わりに show と hide を使用します。うまくいかない場合、問題は別の場所にあります。この実際の例を見ると、これ$('#foo').fadeIn().delay(2000).fadeOut(); は正しいコード行です。

$('#tooltipleft').show(0).delay(5000).hide(0);
于 2013-01-13T14:41:20.587 に答える