Leverkusen Posted March 10, 2014 Share Posted March 10, 2014 hey i have thisecho '<td align="center"><font style=color:lightblue size="2"><b>'.intval(100*$row['win']/$row['played']).'%</b></font></td>';this calculates % of won gamesi want to make a color to red when % is lower than 40%, yellow when is 40-60% and green when is more than 60%how can i do that? if result <40 then show this row in red color Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 10, 2014 Share Posted March 10, 2014 (edited) Put this code in the header section of your html. <style type='text/css'> .color1 { color:red;} .color2 { color:yellow;} .color3 { color:green;} </style> Then do this to generate your display Note the lack of a font tag since that is SO old and deprecated. $val = intval(100 * $row['win'] / $row['played']); if ($val < 40) $cls = 'color1'; elseif($val > 60) $cls = 'color3'; else $cls = 'color2'; $val = $val."%"; echo "<td align='center class='$cls'><b>$val</b></td>"; Note change from single to double quotes on outer pair. Edited March 10, 2014 by ginerjm Quote Link to comment Share on other sites More sharing options...
requinix Posted March 10, 2014 Share Posted March 10, 2014 (edited) Or even cooler than magic terms like "color1" and "color3" would be class names that actually represent the underlying data. .games-highwinratio { color: green; } .games-evenwinratio { color: yellow; } .games-lowwinratio { color: red; } Edited March 10, 2014 by requinix Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 13, 2014 Author Share Posted March 13, 2014 the script is working well but colors are not changed, http://prntscr.com/30icq2 they are red ;o Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 13, 2014 Share Posted March 13, 2014 You put the CSS code in the right place in your html page? And you replaced the styles in the font tag with the $cls var? Perhaps you could post those same parts of your code with the changes you've made? Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 13, 2014 Author Share Posted March 13, 2014 $val= intval(100 * $row['pog'] / $row['odigrano']); if ($val < 40) $cls = 'color1'; elseif($val > 60) $cls = 'color3'; else $cls = 'color2';$val = $val."%";echo "<td align='center' class='$cls'><b>$val</b></td>"; maybe i need to put font style? I did it like this but im not sure beucase of this red ''{'' is it good? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="UTF-8"> <title>Global Betting • Statistics</title> <meta name="author" content="Leverkusen"> <meta name="robots" content="all"> <meta name="keywords" content="bet, global bet, globalbet, kladionica, tiketi, kladionicarska liga, tipster liga, bet league, bet tips"> <meta name="description" content="The best and simplest bet league on the web, bet for fun and prestige. Sign up today in just a few steps."> <meta name="language" content="english"> <link href="images/lopta.gif" rel="shortcut icon"> <link rel="stylesheet" href="style.css" type="text/css" .color1 { color:red;} .color2 { color:yellow;} .color3 { color:green;} media="all"> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-43678870-1', 'us.to'); ga('send', 'pageview'); </script> </head> Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 13, 2014 Author Share Posted March 13, 2014 echo "<td align='center' class='$cls' style=color:'$cls'><b>$val</b></td>"; when i change '$cls' with the name of the color, example: lightblue, its showing everything in lightblue, so i guess the problem is in the place where i put the color1 color2 & colór3 Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 13, 2014 Share Posted March 13, 2014 Your css classes need a period in front Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 13, 2014 Author Share Posted March 13, 2014 whats a period? a dot? in front of where? Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 14, 2014 Share Posted March 14, 2014 Apparently you have never learned any CSS. A class name in a CSS definition looks like what I gave you: ".color1" where there is a period in front of the name. Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 14, 2014 Author Share Posted March 14, 2014 hmm i still dont understand i put those periods whereeve i could but its still the same Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 14, 2014 Share Posted March 14, 2014 Since you didn't understand my last post in English, let's try this. Go back to my post showing you the code and examine it CLOSELY for where the periods are located. (Hint: they are in the css snippet only) Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 16, 2014 Author Share Posted March 16, 2014 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type='text/css'> .color1 { color:red;} .color2 { color:yellow;} .color3 { color:green;} </style> <meta charset="UTF-8"> <title>Global Betting • Statistics</title> <meta name="author" content="Leverkusen"> <meta name="robots" content="all"> <meta name="keywords" content="bet, global bet, globalbet, kladionica, tiketi, kladionicarska liga, tipster liga, bet league, bet tips"> <meta name="description" content="The best and simplest bet league on the web, bet for fun and prestige. Sign up today in just a few steps."> <meta name="language" content="english"> <link href="images/lopta.gif" rel="shortcut icon"> <link rel="stylesheet" href="style.css" type="text/css"> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-43678870-1', 'us.to'); ga('send', 'pageview'); </script> </head> i dont see any difference, now its right next to <head> and has no red '{'but still is not changing colors do i need to put this colors in my style.css? Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 16, 2014 Share Posted March 16, 2014 Your CSS is now correct. Where is the php & html that uses it? Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 16, 2014 Author Share Posted March 16, 2014 while($row = mysql_fetch_array($result)){ if($br%2==0)echo '<tr onmouseover="this.style.backgroundColor=\'#660000\';" onmouseout="this.style.backgroundColor=\'#000000\';" bgcolor="#000000"><align="center" class="odd">'; else echo '<tr onmouseover="this.style.backgroundColor=\'#660000\';" onmouseout="this.style.backgroundColor=\'#000000\';" bgcolor="#000000"><align="center">'; $br++; if($id==$row['id'])echo '<td bgcolor="lime" class="item left">'.$br.'</td>'; else echo '<td align="center"><font size="2"><b>'.$br.'</b></font></td>'; echo '<td align="left"><font style=color:gold size="2"> <img title= "'.$row['grad'].'"src="images/'.$row['drzava'].'.png"/> <a href="?id='.$row['id'].'"><b><font style=color:lightblue size="2">'.$row['tipseter'].'</a></font></td>'; echo '<td align="center"><b>'.$row['odigrano'].'<b></font></td>'; echo '<td align="center"><font style=color:darkorange size="2"><font size="2"><b>'.$row['u_igri'].'</b></font></td>'; echo '<td align="center"><font size="2"><b><font style=color:lime >'.$row['pog'].'</font> / <font style=color:red>'.$row['promaseno'].'</font></td>'; $val= intval(100 * $row['pog'] / $row['odigrano']); if ($val < 40) $cls = '.color1'; elseif($val > 60) $cls = '.color3'; else $cls = '.color2'; $val = $val."%"; echo "<td align='center' class='$cls' style color='$cls'><b>$val</b></td>"; echo '<td align="center"><b>'.round($row['prosjek'],2).'</b></font></td>'; echo '<td align="center" maxlength="5" font size="2" style=color:lightblue><b>'.$row['profit'].'</b></font></td>'; echo '</tr>'; } Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 16, 2014 Share Posted March 16, 2014 What IS this? Where is the implementation of the ideas I gave you? STOP USING INLINE STYLES and STOP USING DEPRECATED THINGS like <font> tags. Quote Link to comment Share on other sites More sharing options...
Ch0cu3r Posted March 17, 2014 Share Posted March 17, 2014 @Leverkusen on this line echo "<td align='center' class='$cls' style color='$cls'><b>$val</b></td>"; remove style color='$cls' Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 17, 2014 Author Share Posted March 17, 2014 i removed that but its still the same, i dont use <font> tag here echo "<td align='center' class='$cls'><b>$val</b></td>"; Quote Link to comment Share on other sites More sharing options...
Solution Ch0cu3r Posted March 17, 2014 Solution Share Posted March 17, 2014 Remove the . (periof) in front of color1, color2 and color3 here $cls = '.color1'; elseif($val > 60) $cls = '.color3'; else $cls = '.color2'; Quote Link to comment Share on other sites More sharing options...
ginerjm Posted March 17, 2014 Share Posted March 17, 2014 If you had spent 30 minutes reading a tutorial on CSS, you would have solved this by now. You create css styles in the style tag in the header section. Classes (which we are using here) are identified by a period in front of their name. The styles are described inside of braces. Hence: .color1 { color:red; font-size:16px; } creates a 'class' named 'color1' which defines the font color to be 'red' and to be 16 pixels in size; In your html you get this style by writing: <span class='color1'> blah blah blah </span> or in any other html tag. Note there is no period used here, only in the css definition. Quote Link to comment Share on other sites More sharing options...
Leverkusen Posted March 18, 2014 Author Share Posted March 18, 2014 dots were the problem thanks Ch0cu3r thanks for co-operating and helping ginerjm Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.