Output CSS only if DIV contains content

Question

Hi,

I have two gallery buttons, a next and previous, each of which is wrapped in a DIV tag, and want to apply a background image to each. However in some galleries at times the next button may not be output if we've reached the end of the available gallery images. Currently my background image would still appear, even though there is no "next" button. I believe it's possible to add a PHP if statement in my CMS template which might say if content appears in this DIV then output the background image, otherwise don't output anything.

Can anyone please assist ? My PHP skills aren't so great :-(

Many thanks in advance.

Answer 1

<?php
if ($content == "") {$background = "style='background-image:none;'";} else {$background = "";}
?>
<div <?php echo $background; ?> >Your Button</div>

---

or better will be to hide the div at all

<?php
if ($content == "") {$display = "style='display:none;'";} else {$display = "";}
?>
<div <?php echo $display; ?> >Your Button</div>

Answer 2

You could aslo use javascript for this. For example in jQuery you would write something like this

//launch code when dom is ready
$(document).ready(){
  //if a div doesn't have content, then we should remove another div
  if(!$('#someDivWithContent').html().length > 0){
    $('#someOtherDiv').hide()
  }
}

you will ofc have to implement jQuery in your site, if you don't already use it for this code example to work.

then you place this code within a < script type="text/javascript"> tag and change the selectors a bit to target your html elements.