0

Plain jQuery binding function is getting called twice for me, I have seen this problem when working with jQuery mobile also. 

$(document).ready(function(){

$(window).bind("resize",function(){

$("#length").text($(window).width());
$("#length").show("slow");
$("#length").hide("slow");
});
});


 <html>
   <body>
     <div id='length' style= display:none></div>
     <div class="font size">1</div>
   </body>
 </html>

fiddled : http://jsfiddle.net/2Yy7Q/

BenMorel
  • 34,448
  • 50
  • 182
  • 322
sij
  • 1,307
  • 7
  • 18
  • 35

1 Answers1

1

Well known browsers behaviour, a possible workaround:

http://jsfiddle.net/2Yy7Q/1/

$(document).ready(function () {
    (function () {
        var timeout;
        $(window).bind("resize", function () {
            clearTimeout(timeout);
            timeout = setTimeout(function () {
                $("#length").text($(window).width());
                $("#length").show("slow");
                $("#length").hide("slow");
            }, 50);
        });

    })();
});

NOTE you could set timeout duration to 0, 50 is to give you the idea

A. Wolff
  • 74,033
  • 9
  • 94
  • 155
  • Here you go: http://stackoverflow.com/questions/5534363/why-does-the-jquery-resize-event-fire-twice – kayen Jan 21 '13 at 12:44