selected <UL><LI> using php / mysql / html

CrOuZ

Hi,
My output in html is :

<uL><li id="B1"></li>
<li id="B2"></li>
<li id="B3"></li>
<li id="B4"></li>
<li id="B5"></li>
<li id="B6"></li>
<li id="B7"></li>
<li id="B8"></li>
<li id="B9"></li>
<li id="B10"></li>
<li id="B11"></li>
<li id="B12" class="active"></li>
<li id="B13" class="no"></li>
<li id="B14" class="no"></li>
<li id="B15" class="no"></li>
<li id="B16" class="no"></li>
<li id="B17" class="no"></li>
<li id="B18" class="no"></li>
<li id="B19" class="no"></li>
<li id="B20" class="no"></li>
</ul>

If MySQL query result is equal to 6, then <li> tag with id equal to "B12" should have class "active". All the <li> elements occuring after this active element should have class "no".

This shows images of horizontal rating between 0 and 10 and between 0.5
Example : 0 .5 1 1.5 2 2.5 3 3.5 4 4.5 5 5.5 6 6.5 7 7.5 8 8.5 9 9.5 10
In the example above elements from 0 to 5 will be blue, element 6 will be white and elements from 7 to 10 are black.

How could I generate this using PHP and/or MySQL?

Thanks, XXXX chirstmas XXXX

bradgrafelman

For one, note that your "no" class isn't even necessary (and it would simplify the corresponding PHP code if it was removed). For example, this:

<!DOCTYPE html>
<html>
<head>
<title>CSS3 :: General Sibling Selector</title>
<style type="text/css">
li { background-color: blue; }
.active { background-color: white; }
li.active ~ li { background-color: black; }
</style>
</head>
<body>
<ul><li id="B1"></li>
<li id="B2"></li>
<li id="B3"></li>
<li id="B4"></li>
<li id="B5"></li>
<li id="B6"></li>
<li id="B7"></li>
<li id="B8"></li>
<li id="B9"></li>
<li id="B10"></li>
<li id="B11"></li>
<li id="B12" class="active"></li>
<li id="B13"></li>
<li id="B14"></li>
<li id="B15"></li>
<li id="B16"></li>
<li id="B17"></li>
<li id="B18"></li>
<li id="B19" ></li>
<li id="B20"></li>
</ul>
</body>
</html>

shows the color scheme you described above.

So now you simply do a [man]for/man loop from 1 thru 20 and output the <li>'s and their id's while checking to see if the current loop counter divided by 2 is equal to the result from the MySQL query; if it is, also output the 'class="active"' text.

CrOuZ

bradgrafelman

Your html code worked but i have for each li one color for Light to dark.
CSS Example :

#Examplediv #B1{background:#0371fc}
#Examplediv #B2{background:#0b6ff4}
#Examplediv #B3{background:#166be9} 
...
...
...

So I need To generate li using my method. can you help me with php code ?

bradgrafelman

CrOuZ;10993725 wrote:
but i have for each li one color for Light to dark.

Yikes... any reason why you don't simply use CSS to generate a gradient background?

CrOuZ

Yes, gradient background worked. For better example please see right columns of this site :
LINK
This is exactly the same method works for me. My main Problem is How To php generate this ?

Thanks

CrOuZ

Any Help ? 🙁