PHP css preloader not loading

**william232** · Mar 7, 2010 18:15

Hi all,

I am developing a php progress bar so i can get to see how much of somthing they have till they reach their target dynamically, this is my attempt below to draw out a progress bar and see how far i am from my target,

PHP Code:


function processbar($i,$e)

{

    //

    $width = round(($e / $i) * 100);

    $display = '<style type="text/css">';

    $display .= ' #progress {   display: block;   }';

    $display .= ' #bar {   display: inline;   width: '.$width.'px;   height: 10px; background-image:   }';

    $display .= ' span:before {   display: block;   content: "'.$_progress.'%";   }';

    $display .= '</style>'."\n";

    echo $display;

    flush();

    //

}

//

function progress_bar($_image, $_lenght)

{

    $display = '<style type="text/css">';

    $display .= '

    #bar

    {

        display: none;

        width: 0px;

        height: 10px;

    }';

    $display .= ' span:before

    {

        display: none; 

        content: "0%"; 

    }';

        $display .= '</style>';

        $display .= '<div id="progress">';

        $display .= ' <img id="bar" src="'.$_image.'" alt="Progressbar" title="Progressbar" />';

        $display .= ' <span id="percent_progress"></span>';

        $display .= '</div>';

        echo $display; 

    flush();

}

//

$max=1000;

$cexp=950;



for($i=1; $i>$max; $i++)

{

    echo "".$i."";

    for($e=1; $e>=$cexp; $e++)

    {

        //

        progress_bar('progress.gif', 200);

        echo progressbar($i,$e);

        //    

    }

}

What i am hopiing to achieve is have the current is the exact they have atm and how much they need remaining to go to the next level,

only problem is that its not working the way i am wanting to display the current amount of experience they have and how much they have left.

How can i achieve that with the code above can anyone help me to achieve the above,

Thanks,William

**Dan Grossman** · Mar 7, 2010 20:03

Neither of those for loops will ever run because the conditions (the middle part) are never true -- $i starts at 1 which is not greater than 1000, and $e starts at 1 which is not greater than or equal to 950.

I don't think you need a loop anyway. You just want to show a bar whose width is proportional to ($cexp / $max) right?

You can also pull all that CSS out of the code and into your page, and just use PHP to output an inline style for the width (style="width: ##") on the element.

**william232** · Mar 7, 2010 20:52

yea i soon realised that i went ahead with another method of mine that did the trick its simply this

Code:

<html>
    <head>
      <link type="text/css" href="http://jqueryui.com/latest/themes/base/jquery.ui.all.css" rel="stylesheet" />
      <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.4.2.js"></script>
      <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/jquery-1.4.1.js"></script>
    <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/ui/jquery-ui.js"></script>
    
      <script type="text/javascript">
      $(document).ready(function(){
        $("#progressbar").progressbar({ value: 5});
      });
      </script>
    </head>
    <body style="font-size:62.5&#37;; width:169px;">
      
    <div id="progressbar"></div>
    
    </body>
    </html>

It all works now thanks for the help anyway mate,

User Tag List

Thread: PHP css preloader not loading

Thread Tools

Display

PHP css preloader not loading

Bookmarks

Bookmarks

Posting Permissions