0

画像をフェードインしようとしていますが、うまくいきません。私はこの投稿を見つけました: Javascript フェード画像インとアウト そして、次のコードを試しましたが、運がありません:(

var anImage= new Image();
anImage.src='images\\anImage.gif'

jQuery(function(){$("anImage").fadeIn()})
anImage.fadeIn()

しかし、「Uncaught TypeError: Object # has no method 'fadeIn'」というエラーが表示されます。私は何か間違ったことをしているに違いない。しかし、私はそれを見ていません:s。助けてください、

前もって感謝します

================================================== ================================ 私のコードは次のようになります。 

var deadImg=      new Image();
deadImg.src='images/dead.gif'
deadImg.id= 'imageID'
deadImg.style.display = 'none'
jQuery('body').append(deadImg);

そして、画像を描画する関数を作成しました（キャンバス上でフェードインします）

function deadScreen(){
GameOverSound.play();
jQuery('#deadImg.id').fadeIn();
}

しかし、実際には何も起こっていません。私は何か間違ったことをしていますか？

================================================== ================================

EDIT3：

function deadScreen(){
   GameOverSound.play();


   //increase the context.globalAlpha 0% ->100% and draw image
   context.globalAlpha= 0%->100%
   context.drawImage(deadImg,0,0,canvas.width,canvas.height);


  //at the end make sure nothing is transparant!
  context.globalAlpha=1
}

このようなことはできますか？for ループなどを使用して、透明度を完全な透明度から非透明度に高めることを考えました。そして、各ステップで画像を再描画します。または、これは良い考えではありませんか？

================================================== ==========================

皆さん、助けてくれてありがとう。グローバル透明度を上げて画像を再描画することで問題を解決しました。これは jQuery を使用せず、キャンバス内にあります。

それでも、私を助けてくれた人々には本当に感謝しています:)

4

3 に答える 3

1

jQueryをずっと使う

Live Demo

$(function() {
  $("<img/>",{"src":"images/anImage.gif","id":"deadImg"})
    .css({"display":"none"})
    .appendTo("body");
});

function deadScreen(){
  GameOverSound.play();
  $("#deadImg").fadeIn();
}
于 2013-10-19T08:22:24.607 に答える
0

これを試して：

var anImage= new Image();
anImage.src='images//anImage.gif' // you need to use this slash "/", not backslash "\"
anImage.id = 'imageID';
anImage.style.display = 'none';
jQuery('body').append(anImage);
jQuery('#imageID').fadeIn();

デモ

于 2013-10-19T07:56:12.527 に答える