我想找到一种基于主内容高度动态调整模块数量的方法。有可能吗?怎么样?在CSS? javascript?
目的是避免在没有内容的情况下使用空白页面。
提前致谢
Vanessa
答案 0 :(得分:1)
这可以通过多种方式实现,有些方面比其他方式更优雅。 我能想到的最简单的一个是仅使用Javascript:
类似于:(未经过测试的代码)
window.addEvent('domready', function() {
// Get heigth of main content
var contentHeight = document.id('content').getHeight();
// While the height of the main content is more than 200
// and less than the height of the modules
while(contentHeight > 200 && contentHeight < document.id('modules').getHeight()) {
// Get the last module and remove it.
$$('#modules .moduletable').getLast().dispose();
}
});
请注意,这假设您使用的是mootools(可能已经由Joomla安装提供)。此外,我的元素选择器可能无法与您的模板一起使用。
同样,即使要移除某些模块,服务器仍将发送所有模块。另一件事是,当网页的DOM已经完全加载时,这将开始,这意味着用户可能会看到模块消失。因此,在开始时隐藏所有模块然后使用类似的循环逐个显示模块也可能更好。
编辑: 您可能更喜欢的另一个样本。
window.addEvent('domready', function() {
// Get heigth of main content
var contentHeight = document.id('gkContent').getHeight();
// While the height of the modules is more than 500
// and less than the height of the modules
while(document.id('gkRight').getHeight() > 500 && contentHeight < document.id('gkRight').getHeight()) {
// Get the last module and remove it.
var banners = $$('#gkRight .adsense2, #gkRight .bannergroup');
if(banners.length > 0) banners.getLast().dispose();
else break;
}
});