0

我是 css 和 php 的新手,如果 Div 为空,我正在尝试找到一种方法来隐藏我的 .item 页面。然后将 item-page 的宽度更改为 100%。现在,旁边占用 85px 空白或不占用。如何在我的 php 文件中执行此操作?

这是我的CSS:

item-page { 
position:relative;
  width: 100%;

}

.item-page aside {
  float:left;
  position:absolute;
  width:85px;

}
gk-article {
  font-size:14px;
  line-height:26px !important;
  margin:0 0 80px 110px;

}

这是我的 php 文件:

<div id="main">                                
<jdoc:include type="component" />

</div>
4

4 回答 4

0

您可以为空与非空设置不同的 css 类规则。这些规则将设置宽度和/或显示。空元素将为零......或者甚至不打印它。然后在您的服务器代码中运行确定状态的任何测试......并将适当的类应用于元素

于 2013-10-31T00:25:45.217 回答
0

您在此处标记了 javascript/jquery,这可能是您应该使用的(不是 PHP)。

(在 jQuery 中)你可以做这样的事情 - 使用 charlietfl 建议的类:

if( $('.item-page aside').html() == '') ) { 
    $('.item-page aside').hide();
    $('.item-page').removeClass('isntempty').addClass('isempty');
} else {
    $('.item-page aside').show();
    $('.item-page').removeClass('isempty').addClass('isntempty');
}

CSS:

.isntempty {
    width: 100%;
}

.isempty {
    width: 50%; /* whatever your default width is */
}
于 2013-10-31T00:29:01.840 回答
0

通过 js 在 php 中检查:

<?php
...
echo "<script>if (document.getElementById('divId').innerText=='')
//or document.getElementById('divId').textContent=='' in firefox//
$('#divId').attr('style','width:100%;');
</script>";
...
?>
于 2013-10-31T00:30:05.500 回答
0

您可以使用 Javascript,使用 jQuery 框架可以执行以下操作:

<script type="text/javascript">
$( document ).ready(function() {

//Hide if empty
if( $('.item-page').is(':empty') ) {
    $('.item-page').hide();
}

//Change to width 100%
$('.item-page').css({width:'100%'});

});
</script>

在这里了解更多:

http://api.jquery.com/empty-selector/

http://learn.jquery.com/using-jquery-core/document-ready/

于 2013-10-31T00:32:35.903 回答