jQuery的淡入，淡出，淡入2

我做了一些在這裏閱讀，但我張貼，因爲我似乎無法找出具體是什麼，我期待的事情。我試着調整現有的代碼，我已經在這裏找到，但沒有這樣的運氣。這可能沒有幫助，我不是很熟悉JavaScript。我是一位正在恢復的Flash設計師。jQuery的淡入，淡出，淡入2

讓我解釋一下：

我有2個的div，一個具有非常大的圖像，一個文本。理想情況下，我想的網頁，以這種方式發揮作用：

沒有在屏幕上
淡入圖像DIV（我認爲這可能需要一些時間來加載第一）
淡出圖像DIV
沒有在屏幕上（即：不淡入淡出）
淡入文本DIV
離開圖像DIV有永久。

對如何處理這個任何想法，將不勝感激！再次，原諒我的無知。

來源

2011-04-18 user713717

$(document).ready(function(){ 

    $('#id-of-img').fadeIn(5000).delay(5000).fadeOut(5000); // 5000 is 5 seconds, change this as you wish 
    $('#id-of-text').fadeIn(5000); 

});

這需要的jQuery 1.4.2或以上的delay()功能

- 編輯 -

剛剛重新閱讀你的問題。你說「離開像格有永久」，你的意思是文本的div？如果是這樣，我做了什麼應該工作，如果沒有的話我真的不明白你的意思。

來源

2011-04-18 16:08:20

由於圖像可能大，線了，一旦圖像成功加載將被解僱的圖像上的事件。從那裏只需使用回調函數在.fadeOut()和.fadeIn()顯示/隱藏的div。

$(function() { 
    $(".image img").load(function() { 
     $(".image").fadeIn("slow", function() { 
      $(this).fadeOut("slow", function() { 
       $(".text").fadeIn("slow"); 
      }); 
     }); 
    }); 
});

Code example on jsfiddle

來源

2011-04-18 16:12:30

使用事件回調

你要當它已經完成加載圖像中，提供了一個回調的方式預加載：

var $textDiv = jQuery('.textDiv'); // contains the text 

var img = new Image(); 
img.src = "images/myImageUrl.jpg"; 
img.onload = function() { 
    jQuery(this).hide().appendTo('.imgDiv').fadeIn(300, function(){ 
     $(this).fadeOut(300, function() { 
      $textDiv.fadeIn(300); 
     } 
    }); 

};

來源

2011-04-18 16:13:15 typeof

jQuery的淡入，淡出，淡入2

回答

相關問題