[英]jQuery css height not applying
For some reason the height is not being set in this piece of code由于某种原因,这段代码中没有设置高度
jQuery(document).ready(function() {
jQuery('#main-content').css({'height': ((jQuery(window).height()))+'px'})
jQuery('#nav-icons a').click(function(){
jQuery('#nav-icons a').removeClass("active-icon");
jQuery(this).addClass( "active-icon" );
var toLoad = jQuery(this).attr('href')+' #main-content';
var toLoadSlider = jQuery(this).attr('href')+' #homepage-slider';
jQuery('#main-content , #homepage-slider').fadeOut(1000, loadContent);
function loadContent() {
jQuery('#homepage-slider').empty().load(toLoadSlider)
jQuery('#main-content').empty().load(toLoad,'',showNewContent())
}
function showNewContent() {
jQuery('#main-content , #homepage-slider').css({'height': ((jQuery(window).height()))+'px'}).hide().fadeIn(2000).removeAttr('id class');
}
return false;
interestingly, the exact same line of code in the showNewContent() does set the height.有趣的是, showNewContent() 中完全相同的代码行确实设置了高度。
The only logical reason for this is that jQuery('#main-content')
in your first line is not the actual jQuery object representation of the DOM element of your choice.唯一合乎逻辑的原因是第一行中的
jQuery('#main-content')
不是您选择的 DOM 元素的实际 jQuery 对象表示。
You will have to figure that out yourself as to why things turn out this way.你必须自己弄清楚为什么事情会变成这样。
Assuming that you have假设你有
<div id="main-content">
... content
</div><!--main-content-->
This should do the trick :这应该可以解决问题:
var windowHeight = jQuery(window).height();
jQuery(document).ready(function ($) {
$('#main-content').css({
height: windowHeight
});
// other scripts
}); // ready
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.