css - jquery height() returning 0 value -
i have small script written center content of div setting padding top & bottom adjacent div:
$(document).ready(function() { $('.index-block:first').css({ 'padding-top': (($(window).height() - $('.cta').height()) / 4) - $('footer').height() + "px", 'padding-bottom': (($(window).height() - $('.cta').height()) / 4) - $('footer').height() + "px" }); $('.search').css({ 'padding-top': ($('.brand').height() - $('.search').height()) / 4 + "px", 'padding-bottom': ($('.brand').height() - $('.search').height()) / 4 + "px" }); alert('brand: ' + $('.brand').height() + ' | search: ' + $('.search').height()); });
html:
<div class="index-block cta row"> <div class="col-md-4 brand"> <img src="/static/images/logo.png" alt="<!-- tmpl_var instance_name -->" /> </div> <div class="col-md-8 search"> <h1>property experts<br><small>neighborhood enthusiasts</small></h1> <hr> <search-form></search-form> <div class="button-group"> <a class="btn btn-primary" href="/leads/buy"><span>buying home?</span></a> <a class="btn btn-primary" href="/leads/sell"><span>selling home?</span></a> <a class="btn btn-primary" href="/leads/cma"><span>what's home worth?</span></a> </div> </div> </div>
it works fine in fiddle not in live demo. in live demo heights brand , search 0;
in site move script $(window).load(function() {
$(document).ready(function() {
Comments
Post a Comment