0

I have a script that resize a text .div (.block-left), to make room for a large picture. The picture width and height are determined by the user window. Depending on this parameters the text .div adapts itself.

To make do, the script runs twice, when the window is ready and when resized.

On most browsers the script works properly when the window is ready, but they are some hiccups on refresh, especially with Safari. The resize script, however, never encounters any bugs.

Here is the script (the same is used when on window resize) : 

<script> 
$(document).ready(function() {
var imgWidth = ($(".picture img").width()+ 20 + "px");
  $(".block-left").css("margin-left", imgWidth);
});
</script>

You can see what it is supposed to accomplish on this screenshot :

enter image description here

What can I do to force the script to load first thing?

cfocket
  • 105
  • 2
  • 15
  • 3
    Maybe you should use instead: `$(window).on('load resize',function() {...});` And of course remove the other resize handler – A. Wolff Jan 15 '14 at 16:32
  • @A. Wolff : Oh great it's working and gives me better performances. Should I conclude that using .on('load') is better/faster than when document.ready? – cfocket Jan 15 '14 at 16:39
  • They don't do the same thing: http://stackoverflow.com/questions/8396407/jquery-what-are-differences-between-document-ready-and-window-load – A. Wolff Jan 15 '14 at 16:40
  • So .on('load') works better here because it has a better understanding (more informations) on how the page is structured? – cfocket Jan 15 '14 at 16:41

0 Answers0