Ok. This script is ready for review. Note it needs some variables to
be linked with actual data, and all <a> links are unset.
Also, the CSS may not be to your liking, only some size and
positioning settings are important. The fill image is a transparent
glass effect, so the colour can be changed from CSS.
Get the "meter-scale.png"
http://www.filefactory.com/file/b562ac1/n/meter-scale.png
and get "meter-fill.png" from
http://www.filefactory.com/file/b562abh/n/meter-fill.png
Do you want a donate button or link? If button, chrome (browser
widget) button or image button?
--------------------------------------------- The script (embedded
HTML with PHP and CSS) ---------------------------------------------
<?php
$donation_goal = 2000;
$donation_current = 1568; // Where to link this?
$currency = '$'; // What currency to use?
$countdown = 20; // Where to link this?
$donation_percent = ($donation_current / $donation_goal) * 100;
if ($donation_percent > 100) {
$donation_percent = 100;
} elseif ($donation_percent > 99 && $donation_percent < 100) {
$donation_percent = 99;
} elseif ($donation_percent < 1 && $donation_percent > 0) {
$donation_percent = 1;
} else {
$donation_percent = round($donation_percent);
}
$donation_pixels = $donation_percent * 2;
?><html><head><title>Donate - version3</title>
<style>
div#donate {
width:400px;
border-radius:6px;
background:#efffef;
border:1px solid #106802;
overflow:hidden;
} #donate table {
width:100%;
} #donate p,h2 {
margin:0px 5px 3px;
} #donate h2 {
color:#111;
padding:0;
} #goal {
color:#222;
padding:0 0 2px;
} #marker0 {
cursor:default;
color:#106802;
position:relative;
top:-3px;
width:200px;
text-align:center;
} #marker1 {
cursor:default;
background:#ccf4c6;
margin:-5px 5px 5px;
width:200px;
} #marker2 {
position:relative;
width:<?php echo($donation_pixels);?>px;
height:15px;
background:#18a303 url('meter-fill.png') repeat-x;
bottom:0;
left:0;
display:block;
border-right:1px solid #18a303;
} #marker3 {
position:relative;
left:-1;
display:block;
width:202px;
}
</style></head><body>
<!--donation meter begin-->
<div id="donate"><?php
if ($countdown > 0) {?>
<table border="0" cellpadding="1"
cellspacing="0"><tbody>
<tr>
<td>
<h2>Donate Today!</h2>
</td>
<td rowspan="3" valign="middle" style="width:200px;">
<p id="marker0">
<?php
echo($currency.$donation_current.", ".$donation_percent);?>%
</p>
<div id="marker1">
<div id="marker2">
<img id="marker3"
src="meter-scale.png"/>
</div>
</div>
</td>
</tr>
<tr>
<td>
<p id="goal">
Our target is: <?php
echo($currency.$donation_goal);?>
</p>
</td>
</tr>
<tr>
<td>
<p id="countdown"><?php if($countdown < 5) echo("Only
");echo($countdown);?> days left!</p>
</td>
</tr>
<tr>
<td colspan="2" valign="middle">
<p style="text-align:center;"><a href="">Donate
now!</a></p>
</td>
</tr>
</tbody></table>
<?php } else {?>
<h2>Time's up.</h2>
<p>You can <a href="">donate</a> anyway, though, if you want!</p><?php
}?>
</div>
<!--donation meter end-->
</body></html>
--------------------------------------------- End of script
---------------------------------------------
--
Unsubscribe instructions: E-mail to [email protected]
List archive: http://listarchives.libreoffice.org/www/website/
*** All posts to this list are publicly archived for eternity ***
