0

index.php

<?php
            //image gallery

            $result = mysql_query("SELECT * FROM `image_upload`") or die(mysql_error());

            while ($data = mysql_fetch_array($result)){

            echo $data['title'].'<br>';
            echo $data['news'].'<br><br>';
            //echo '<img src="images/'.$data['newfilename'].'">';

            echo '<style>
            .circular {
            width: 300px;
            height: 300px;
            border-radius: 150px;
            -webkit-border-radius: 150px;
            -moz-border-radius: 150px;
            background: url(http://localhost/portal_bootstrap/images/'.$data['newfilename'].') no-repeat;
            }       
            </style>';
            echo '<div class="circular"></div>';
            }

            ?>

Hello,

I thought this : $data['newfilename'] suppose to keep changing . I wonder why the result of : <div class="circular"></div>
the same picture all the way.

2
Contributors
1
Reply
22
Views
2 Years
Discussion Span
Last Post by rtrethewey
0

The problem is that you put the '<style>' section in the 'while' loop, so the resulting HTML page contains multiple instances of the CSS rule for .circular. Then when the page is rendered, the browser uses the last instance of this rule for all of the <div class="circular"> tags.

Your code should read more like:

    <?php
    //image gallery
    echo '<style>
    .circular {
    width: 300px;
    height: 300px;
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    border-radius: 150px;
    background-repeat:no-repeat;
    }
    </style>';
    $result = mysql_query("SELECT * FROM `image_upload`") or die(mysql_error());
    while ($data = mysql_fetch_array($result)){
     echo $data['title'].'<br>';
     echo $data['news'].'<br><br>';
     echo '<div class="circular" style="background-image:url(http://localhost/portal_bootstrap/images/' . $data['newfilename'] . ')"></div>';
    }
    ?>
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.