Jump to content

css background style in php code

Caitlin-havener

By Caitlin-havener
in PHP

Recommended Posts

Caitlin-havener Member

Caitlin-havener

Posted
Posted

Trying to figure out why the following background image is not being placed in the div. Can you see? I'm assuming you can place a background img in a div...

<?php	session_start();	// STARTER KIT for Battleship - DIG 3134 - Spring 2011 - Moshell// Derived from the Wall War prototype$Testnumber=3; // use 3 to see the Ship's methods at work.$Gridsize=16;$Imagewidth=300; // pixels$Cellwidth=$Imagewidth/$Gridsize;define('BLACK','#000000');define('GOLD','#AAAA33');define('BLUE','#0000FF');define('WHITE','#FFFFFF');define('YELLOW','#FFF600');define('GREY','#888888');define ('RED','#FF0000');#makeheader:function makeheader(){ global $Cellwidth;	print '	  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">	<html xmlns="http://www.w3.org/1999/xhtml">	<head>	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />	<title>Damage Control</title>';print "	<style type='text/css'>			.mtable td 			{				width:$Cellwidth"."px; height:$Cellwidth"."px;				color:RED			}			#center			{				background-img:url('bckgrd.jpg');			}		</style>";print '</head><body><form method="post">';} # makeheaderfunction preparegrid(){global $Grid, $Gridsize, $Visible;	for ($y=0; $y<=$Gridsize+1; $y++)	{		for ($x=0; $x<=$Gridsize+1; $x++)		{			if ($x==0) // left margin			{				$Grid[$x][$y]=BLUE;				//$Visible[$x][$y]=1;			}			else if ($y==0) // top margin			{				$Grid[$x][$y]=BLUE;				//$Visible[$x][$y]=1;			}			else if (($x==$Gridsize+1)||($y==$Gridsize+1))			{	// right margin and bottom margin				$Grid[$x][$y]=BLUE;				//$Visible[$x][$y]=1;			}			else	// fill the dude with white!			{				$Grid[$x][$y]=WHITE;				//$Visible[$x][$y]=0;			}						} # x loop	} # y loop} # preparegridfunction drawgrid(){global $Grid, $Gridsize;	$result='<table class="mtable" border=1>';	for ($y=0; $y<=$Gridsize+1; $y++)	{		$result.="<tr>";		for ($x=0; $x<=$Gridsize+1; $x++)		{			if ($x==0) $char=$y;			else if ($y==0){ 				if($x<27)            		$char= strtoupper(chr($x+96)); 			}			//$char=$x; //printing x here columns			else if ($Grid[$x][$y]==BLUE)				$char=" ";			else $char="<input type='radio' name='fillhere' value='$x.$y'>";			$color=$Grid[$x][$y];			$result.="<td align='center' style='background-color:$color'>$char</td>";		} # x loop		$result.="</tr>";	} # y loop	$result.="</table>";	print $result;} #drawgrid#drawinputs:function drawinputs(){	print "		<input type='submit' name='action' value='BOMB' />		<input type='submit' name='action' value='CLEAR' />				";}////////// CLASS DEFINITIONSclass Ship{	private $shipnumber, $xloc, $yloc, $orientation, $type;		function __construct($shipnumber, $xin,$yin, $orientation, $type)	{		$this->shipnumber=$shipnumber;		$this->xloc=$xin;		$this->yloc=$yin;		$this->orientation=$orientation;		$this->type=$type;	}		function describe()	{		print "shipnumber:$this->shipnumber <br />				x, y: $this->xloc $this->yloc <br />				orientation: $this->orientation <br />				type: $this->type <br />";	} # describe		function isfloating()	{		global $Grid;		$orientation=$this->orientation;		if ($orientation=="horizontal"){			$y=$this->yloc;			for ($x=$this->xloc;$x<=$this->xloc+4; $x++)			{				if ($Grid[$x][$y]==$this->type)					$count++;			}		}		else if ($orientation=="vertical"){			$x=$this->xloc;			for ($y=$this->yloc;$y<=$this->yloc+4; $y++)			{				if ($Grid[$x][$y]==$this->type)					$count++;			}		}		else if ($orientation=="diagonal"){			$x=$this->xloc;			$y=$this->yloc;			for ($i=0; $i<=4; $i++){				if ($Grid[$x+$i][$y+$i]==$this->type)					$count++;			}		}		if ($count>=3)			return 1;		else			return 0;	} # isfloating		#mycolorcount:	function mycolorcount()	{		global $Grid;		$orientation=$this->orientation;		if ($orientation=="horizontal"){			$y=$this->yloc;			for ($x=$this->xloc;$x<=$this->xloc+4; $x++)			{				if ($Grid[$x][$y]==$this->type)					$count++;			}		}		else if ($orientation=="vertical"){			$x=$this->xloc;			for ($y=$this->yloc;$y<=$this->yloc+4; $y++)			{				if ($Grid[$x][$y]==$this->type)					$count++;			}		}		else if ($orientation=="diagonal"){			$x=$this->xloc;			$y=$this->yloc;			for ($i=0; $i<=4; $i++){				if ($Grid[$x+$i][$y+$i]==$this->type)					$count++;			}		}		return $count;	} # mycolorcount		#myspectrum:	function myspectrum()	{		global $Grid;		$orientation=$this->orientation;		if ($orientation=="horizontal"){			$y=$this->yloc;			for ($x=$this->xloc;$x<=$this->xloc+4; $x++)			{				$spectrum[$Grid[$x][$y]]++;			}		}		else if ($orientation=="vertical"){			$x=$this->xloc;			for ($y=$this->yloc;$y<=$this->yloc+4; $y++)			{				$spectrum[$Grid[$x][$y]]++;			}		}					return $spectrum;	} # myspectrum;		function drawship()	{		global $Grid, $Value;		$ship_color=$this->type;		$orientation=$this->orientation;		$shipnumber=$this->shipnumber;		if ($orientation=="horizontal"){			$y=$this->yloc;			for ($x=$this->xloc;$x<=$this->xloc+4; $x++)			{				$Grid[$x][$y]=$ship_color;				/*	$Value[$x][$y]=$shipnumber;			print "shipnumber: $shipnumber";				print " : Boat1:".$Value[$x][$y];				echo ' x value: '.$x.';';				echo ' Y value: '.$y.';<br />';*/			}		}		else if ($orientation=="vertical"){			$x=$this->xloc;			for ($y=$this->yloc;$y<=$this->yloc+4; $y++)			{				$Grid[$x][$y]=$ship_color;			/*	$Value[$x][$y]=$shipnumber;				print "shipnumber: $shipnumber";				print " : Boat2:".$Value[$x][$y];				echo ' x value: '.$x.';';				echo ' Y value: '.$y.';<br />';*/			}		}		else if ($orientation=="diagonal"){			$x=$this->xloc;			$y=$this->yloc;			for ($i=0; $i<=4; $i++){				$Grid[$x+$i][$y+$i]=$ship_color;			}		}			}	function isfloating2()	{		$spectrum=$this->myspectrum();		if ($spectrum[$this->type]>=3)			return 1;		else			return 0;		// you can also use:  		//		return ($spectrum[$this->type]>=3);		//		because the (expression) is either true (1) or false (0)	} #isfloating2	} # Ship/////// MAIN PROGRAM ///////	makeheader();		$action=$_POST['action'];	$Grid=$_SESSION['Grid'];	$ship=$_SESSION['ship'];	$Value=$_SESSION['Value'];		print "<div id='center'>";	print "<center><h3>Damage Control</h3>";	if ((!$action)||($action=='CLEAR'))	{				preparegrid();		//$Shipone=new Ship(1,2,2,"horizontal","#000000");		$ship[1]=new Ship(1,1,1,'horizontal',BLACK);		$ship[2]=new Ship(2,3,3,'vertical',GOLD);		$ship[3]=new Ship(3,7,7,'diagonal',BLACK);			$ship[1]->drawship();		$ship[2]->drawship();	    $ship[3]->drawship();		//$ship[4]->drawship();			}			else // these commands need the X, Y coordinates	{					$f=$_POST['fillhere'];		if ($f)		{			$fparts=explode('.',$f);			$x=$fparts[0];			$y=$fparts[1];		}				if ($action=='BOMB'){			if ($Grid[$x][$y]==WHITE){				$Grid[$x][$y]=BLUE;				print "Sploosh!";			}			else if (($Grid[$x][$y]==GREY) || ($Grid[$x][$y]==YELLOW)){				print "Boom Again!";			}			else if ($Grid[$x][$y]==BLACK){				$Grid[$x][$y]=GREY;				$i=$Value[$x][$y];				$floating=$ship[$i]->isfloating();				if ($floating)					print "Boom!";				else if (!$floating)					print "Arrggh! The ship sank!";			}			else if ($Grid[$x][$y]==GOLD){				$Grid[$x][$y]=YELLOW;				$i=$Value[$x][$y];				$floating=$ship[$i]->isfloating();				if ($floating)					print "Boom!";				else if (!$floating)					print "Arrggh! The ship sank!";			}		}				/*else if ($action=='SHOW SHIP')		{			print "/////// Describe the Ship: ////////<br />";			$ship[1]->describe();			print "/////// the 'isfloating' method says: ////////<br />";			print $ship[1]->isfloating();			print "<br /> /////// the 'mycolorcount' method says: ////////<br />";			print $ship[1]->mycolorcount();			print "<br />/////// the 'isfloating2' method says: ////////<br />";			print $ship[1]->isfloating2();				}*/		} # 		drawgrid();			drawinputs();					$_SESSION['ship']=$ship;	$_SESSION['Value']=$Value;	$_SESSION['Grid']=$Grid; // Store the grid and the visibility for the next cycle?></div></form></body></html>

Link to comment
Share on other sites
jeffman w3schools Guru

jeffman

Posted
Posted

There are 3 normal reason why this happens.1. the path to the image is incorrect2. elements in front of the image have a background that obscures the div's background.3. the contained elements are floated, so that the div has no physical height. You can check this in your DOM inspector.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...