Jquery With ve Iframe ve İlerleme Göstergesi'ni kullanın

Question

Bunun bir yerde var olduğunu biliyorum ama aramayı birkaç saat içinde bulamadım. Sadece bir IFRAME içine bir müşterinin harici sayfasını yüklemek zorundayım, ancak dış verileri kaparken yükleme görüntüsünü sunmak için jquery ui kullanmak istiyorum.

Basit evet, ama bunların hiçbir parçasını görmedim.

Answer 1

Böyle bir şey mi var?

Canlı Örnek:http://jsfiddle.net/CPadm/

DÜZENLEME:iframe yüklü dek gizli şekilde güncellendi.

Canlı (güncellenmiş) Örnek:http://jsfiddle.net/CPadm/3/

HTML

<div id="button">Click to load</div> 

<iframe></iframe> 

<div id='loading'>Page is loading...</div>​ 

CSS

iframe { 
    display: none; 
} 
#button { 
    background: blue; 
    color: white; 
    padding: 10px; 
    width: 100px; 
} 
#loading { 
    width: 300px; 
    padding: 20px; 
    background: orange; 
    color: white; 
    text-align: center; 
    margin: 0 auto; 
    display: none; 
}​ 

jQuery

$('iframe').load(function() { 
    $('#loading').hide(); 
    $('iframe').show(); 
}); 

$('#button').click(function() { 
    $('#loading').show(); 
    $('iframe').attr("src", "http://www.apple.com/"); 
});​ 

---

İlgili jQuery dokümanlar:

• .load() - http://api.jquery.com/load-event/
• .hide()-http://api.jquery.com/hide/
• .show()-http://api.jquery.com/show/
• .attr() - http://api.jquery.com/attr/