CODEWITHSUNDEEP
javascriptjquery
MetalParchment
MetalParchment

Reputation: 75

Apply a script without loading delay

I am using a small JavaScript snippet to align the bottom edge with a small sidebar section ("Hot Right Now") with the bottom edge of the Featured Image section on a website I'm working on.

The script kicks in only once the entire p[age has loaded, and as a result, the section I'm trying to align jumps a bit. How should I modify the script to align it right away?

Here's the snippet I'm using:

<script type="text/javascript">
$( document ).ready(function() {
  var leftheight = $(".featured-image a img").offset().top + $(".featured-image a img").height();
  var rightheight = $('#top-posts-2').offset().top + $('#top-posts-2').height();
  var heightgap = leftheight - rightheight;
  $('#top-posts-2').css('padding-top', parseInt(heightgap + 3, 10) + 'px');
});
</script>

Upvotes: 0

Views: 57

Answers (1)

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

Remove the $( document ).ready wrapper and put the script block immediately after the HTML element it is going to manipulate. You can't run it any earlier than this because the HTML you target needs to be in the page.

Upvotes: 2

Related Questions