2

私はjavascriptでこの関数を持っています：

function loadPage (url){
  showLoadPageGif();         // visibility On
  document.location.href = getPath + "/" + url ;  
}

この機能を使用すると、GIF画像が画面に表示されますが、機能しません。誰かが以前にこの問題で戦ったことがありますか？thnx

4

3 に答える 3

7

私は最近、疑似要素の背景画像としてアニメーション SVG を使用してこの問題に遭遇しました。window.location = url;他のすべての CSS アニメーションとホバーがまだ機能しているのは奇妙でしたが、SVG コグは動かなくなりました。

いくつか遊んだ後、変更する代わりにwindow.locationGET フォームを送信すると、アニメーションが引き続き実行されることがわかりました。

var url;
//load & setup loading animation
//then generate and submit form with a slight delay
setTimeout(function(){
  var new_form;
  new_form = document.createElement('form');
  new_form.method = 'GET';
  new_form.action = url;
  document.body.appendChild(new_form);
  new_form.submit();
}, 100)

Safari 5.1、Firefox 24、Chrome 32 でテスト済み

于 2014-02-12T23:39:28.273 に答える
3

「GIFアニメーションが止まる」という意味だと思います。

これは正しい動作です。新しいページに移動すると、古いページのすべてのリソースが解放されます。これにはもちろん、GIF 自体も含まれます。

を割り当てたときにブラウザが空白のページをレンダリングする時間を無駄にしないため、これが起こっていることを「見る」ことはありませんlocation.href。

必要なことは、AJAX を使用して新しいページを要求し、成功ハンドラーで DOM 全体を新しいページに置き換えることです。

IE6 にはバグがあり、AJAX リクエストを開始するとアニメーションが停止します。これを修正するにsrcは、画像の属性を再度割り当てて (つまりimg.src = img.src;)、再起動します。

于 2013-02-08T12:56:57.530 に答える
2

どのブラウザを使用していますか? IEを使用している場合は、これを行うだけで同じことを1回行う必要がありました。

var loadingFigure = $('#myImage');
var html = loadingFigure.html();            
window.location.href = 'myImage';
loadingFigure.html(html);

Firefox はより複雑なため、iframe を使用して次のようにする必要があります。

<iframe id="myIframe" src="/images/busy.gif" scrolling="no" frameborder="0"></iframe>

$('#myIframe').attr('src', '/images/busy.gif');
window.location.href = 'mylocation'       
$('#myIframe').attr('src', '/images/busy.gif');
于 2013-03-05T19:11:14.817 に答える