Hello,

I am trying to make the frontend banner works.

index.php

<html>

<link href= "css/style.css" rel="stylesheet" type="text/css" media="screen">

<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/chili-1.7.pack.js"></script>
<script src="js/jquery.cycle.all.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript" ></script>

<script type="text/javascript">
$('#slideshow').cycle({ 
    fx:     'fade', 
    speed:   900, 
    timeout: 10000, 
    pager:  '#nav', 
    pagerAnchorBuilder: function(idx, slide) { 
        // return selector string for existing anchor 
        return '#nav li:eq(' + idx + ') a'; 
    } 
});
</script>


<?php  include('includes/navigation.php'); ?>

<body>

<div id="bannerbackground"></div>

<div id="container">



<div id="demos">
    <div id="slideshow" class="pics">
        <?php /*
        <img src="images/indonusa banner1.jpg" width="900px"/>
        <img src="images/indonusa banner2.jpg" width="900px"/>
        <img src="images/indonusa banner3.jpg" width="900px"/>   
        */ ?>
        <?php
        include('include/con_database.php');
        $result2 = mysql_query("SELECT * FROM dynamic_content WHERE CatID='11' ORDER BY images DESC ");

        while ($data2 = mysql_fetch_array($result2)){
        echo '<td>'.'<img src="images/banner/'.$data2['images'].'" width="900px">'.'</td>'.'<br>';
        }
        ?>  
    </div>
    <ul id="nav">
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>   
    </ul>
</div>

Please help me fix the code. It works before I comment out the following 3 images three lines.

<?php /*
            <img src="images/indonusa banner1.jpg" width="900px"/>
            <img src="images/indonusa banner2.jpg" width="900px"/>
            <img src="images/indonusa banner3.jpg" width="900px"/>   
            */ ?>
            <?php
            include('include/con_database.php');
            $result2 = mysql_query("SELECT * FROM dynamic_content WHERE CatID='11' ORDER BY images DESC ");

            while ($data2 = mysql_fetch_array($result2)){
            echo '<td>'.'<img src="images/banner/'.$data2['images'].'" width="900px">'.'</td>'.'<br>';
            }
            ?>  

Now, after I replace it with the above php codes, besides the location is out of place, the banner time lag is also very far (the banner changes very slowly and also there are some blank banner appears before it start showing the real banner).

Using firebug comparing between my banner that is using CMS and not using CMS here is the code:

The one that is not using CMS does work, where as the one that is using CMS does not work:

Not using CMS

<div id="container">
<div id="demos">
<div id="slideshow" class="pics" style="position: relative;">
<img width="900px" src="images/indonusa banner1.jpg" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 3; opacity: 0; width: 900px; height: 976px;">
<img width="900px" src="images/indonusa banner2.jpg" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 3; opacity: 0; width: 900px; height: 976px;">
<img width="900px" src="images/indonusa banner3.jpg" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 4; opacity: 1; width: 900px; height: 976px;">
</div>
<ul id="nav">
</div>

using CMS

<div id="container">
<div id="demos">
<div id="slideshow" class="pics" style="position: relative;">
Connected successfully
<br style="position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0;">
<br style="position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0;">
<img width="900px" src="images/banner/681325.jpg" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0; width: 900px; height: 373px;">
<img width="900px" src="images/banner/50952964.jpg" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0; width: 900px; height: 373px;">
<img width="900px" src="images/banner/260998880.jpg" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 6; opacity: 1; width: 900px; height: 373px;">
</div>
<ul id="nav">
</div>

How to write the correct banner frontend CMS code so that the banner works perfectly like Indonusa without CMS ?

I am currently working for the code that is using CMS.

Where is the following code comes from?

<br style="position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0;">
<br style="position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0;">
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.