なんらかの理由で、次のとおりです。
$(function() {
$(window).resize(function() {
alert("resized!");
});
});
ページがロードされたときにのみイベントを発生させます。ブラウザー ウィンドウのサイズを変更しても、Safari と Firefox の両方で何も起こりません。他のブラウザでは試していません。
アイデアや回避策はありますか?
なんらかの理由で、次のとおりです。
$(function() {
$(window).resize(function() {
alert("resized!");
});
});
ページがロードされたときにのみイベントを発生させます。ブラウザー ウィンドウのサイズを変更しても、Safari と Firefox の両方で何も起こりません。他のブラウザでは試していません。
アイデアや回避策はありますか?
ウィンドウのサイズ変更や本文のスクロールなど、多くのトリガーを生成する可能性のあるイベントにアタッチすることは避けるのが最善です。これらのイベントからのフラッディングのより良いアプローチは、タイマーを使用して偶数が発生したかどうかを確認してから、適切なアクションを実行することです。 、 このようなもの:
$(function() {
var $window = $(window);
var width = $window.width();
var height = $window.height();
setInterval(function () {
if ((width != $window.width()) || (height != $window.height())) {
width = $window.width();
height = $window.height();
alert("resized!");
}
}, 300);
});
タイマーを使用してそれを行うもう1つの利点は、チェックする頻度を完全に制御できることです。これにより、ページの追加機能を検討する必要がある場合に柔軟性が得られます。
あなたのアラートが問題を引き起こしていると思います代わりにこれを試してください
$(window).resize(function() {
$('body').prepend('<div>' + $(window).width() + '</div>');
});
どのブラウザでも動作します:
http://jsbin.com/uyovu3/edit#preview
$(window).resize(function() {
$('body').prepend('<div>' + $(window).width() + '</div>');
});
5年後...
私がこの問題を抱えている唯一のブラウザは Chrome です。私はサファリを持っていません。
私が気づいたパターンは、コードをインライン化すると機能することです。
<script type="text/javascript">
$(window).resize(function(e) { console.log("resize inline", +new Date()) });
</script>
しかし、私がロードする別のJavascriptファイルにそれを入れたときではありません:
<script type="text/javascript" src="/js/resized.js"></script>
スクリプトが含まれている場所
console.log('script loaded');
$(window).resize(function(e) { console.log("resize in script file", +new Date()) });
これは、Chrome 開発チームによって組み込まれたある種の「保護」であると推測することしかできませんが、ばかげて迷惑です。少なくとも、「同じドメインポリシー」を使用してこれをバイパスできたはずです。
しばらく更新して修正したと思ったの$(document).ready()ですが、どうやら間違っていたようです。
試す
$(document).resize(function(){ ... };);
ブラウザ間で一貫してサイズ変更を実行するドキュメントだと思います。しかし、私は今、私が普段何をしているのかをチェックするために仕事をしていません。
私は同じ問題を抱えていて、あらゆる種類の解決策を見て、うまくいきませんでした。
いくつかのテストを行うと、少なくとも私の場合、$(window).resize はその前に $(document).ready() でのみトリガーされることに気付きました。$(function()); ではありません。$(window).ready(); でもありません。
したがって、私のコードは次のとおりです。
$(document).ready(function(){
$(window).resize(function(){
// refresh variables
// Apply variables again
});
});
…そして警戒作業さえも!