在php中新添加的内容上添加小图像标记

Actually i want to add a small gif image over another image for the latest added games. Means i have games site like this http://www.girlsgogames.com/ .. i want to add the NEW tag over an image for my recently uploaded games. Means whatever the latest 5 games i upload, for those games i want to add the new tag automatically...means whenever i upload new 5 games the new tag will come over on the latest games. I want to acheive this using php mysql..can anyone help me in this case..i have added small image for reference.

I have added this code. please check it once..

    <div style="width:980px; float:left">
                <div class="upperLeftCorner980"></div>
                <div class="upperCenter980">
                  <div style="text-align:left">Today's Top <?php echo NEW_GAME_TITLE;?>
                  </div>
                </div>
                <div class="upperRightCorner980"></div>
                <div style="clear:both"></div>
                <div class="centerLeft980">
                  <div class="centerRight980">
                    <div class="boxContentDiv" style="height:100%">
                    <div style="width:373px; height:309px; float:left; margin-left:10px; padding-top:30px">
                    <center>
                    <script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxx";
/* 336x280, created 1/21/11 hope page new games */
google_ad_slot = "xxxxxxxxxxxx";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

                    </center>
                    </div>
                        <div style='padding:3px'>
                            <?php
                       $gameQuery = mysql_query ("SELECT * FROM games ORDER BY id DESC LIMIT 16");

                                while ($gameRow = mysql_fetch_assoc($gameQuery)){
                                                                    if ($_SESSION['lang'] == 'fr'){
                                            $description = $gameRow['description_fr'];
                                        }else{
                                            $description = $gameRow['description'];
                                        }

            ?>
<div style='float:left; width:180px; height:160px; margin:5px;' title="<div style='font-size:12px; font-weight:bold'><b>Description:</b> <?php echo $description;?></div><div style='font-size:12px; font-weight:bold'><b><?php echo GAME_TIME_PLAYED_TITLE;?>:</b> <?php echo $gameRow['time_played'];?></div>" class='tooltip'>


<?php
    $x = 0;
foreach($gameRow as $game) {

//Below is line 65 where i am getting error..at exactly echo "<div class=''gameBGBox'>"

echo "<div class='gameBGBox'><a href='<?php echo $confRow['sitePath'];?>play/<?php echo str_replace(' ','_',$gameRow['name']);?>'><img src='<?php echo $confRow['sitePath'];?>games/images/<?php echo $gameRow['img_100x75'];?>' width='180' height='135' border='2' alt='<?php echo $gameRow['name'];?>'/></a>";
    if($x<5){
    echo '<div class="new"></div>';
    }
    echo "</div>";
    $x++;
}
?>               </div>
                            <?php } ?>
                            <div style='clear:both'></div>
                           </div>
                    </div>
                  </div>
                </div>
                <div class="lowerLeftCorner980"></div>
                <div class="lowerCenter980"></div>
                <div class="lowerRightCorner980"></div>
                <div style="clear:both"></div>
                <div style='height:5px'></div>
                <!-- Separator -->
        </div> 

I am getting this error: Parse error: syntax error, unexpected T_ENCAPSED_AND_WHITESPACE, expecting T_STRING or T_VARIABLE or T_NUM_STRING in C:\xampp\htdocs\myproject\main.php on line 65

Retreive the list ordering by the id:

select * from games order by id desc

Then loop trhough it:

<ul id="game_list">
    <?php
        $count = 0;

        foreach($games as $game) {
            echo '<li><img src="' . $game['img_location'] . '" />';

            if($count < 5) {
                echo '<div class="new"></div>';
            }

            echo '</li>';
            $count++;
        }
    ?>
</ul>

And the CSS:

#game_list {
    list-style: none;
}

#game_list li {
    position: relative;
    z-index: 1;
}

.new {
    position: absolute;
    top: 0;
    right: 0;
    width: 80px; /* w of new banner img */
    height: 80px; /* h of new banner img */
    background: url(../img/new_banner_img.png) 0 0 no-repeat;
    z-index: 2;
}

You can do it like:

<?php 
for($x=0;$x<count($GAMES_ARRAY);$x++) {
?>
<div class="game-images">
     <img src="cover.png"/><? if ($x<5) {?><img src="new.gif" style="position: relative; left: 10px; z-index: 1;"/><? } ;?>
</div>
<? } ?>

So the "new.gif" will overlayed onto the cover.png.

Edit: You have to play little bit with "left" and "top" values.

You can use pseudo elements like ::before and ::after in your css to acomplish this. Here is a small tutorial on how to do this.

try this code it will work in all browsers

Use z-index to overlay one image over the other

<div >
     <img src="banner.jpg" style='position:absolute; z-index=0;'/>
     <img src="new.gif" style="position: fixed; right: 10px; z-index: 1;"/>
</div>

Update for the Latest five games

use a query such that the games are ordered in descending order , then if count is less than 5 then overlay new.gif else dont.

Query

select * from GameTable order by id desc