Skocz do zawartości
krzysiek02

[Zlecę]Pasek dotacji

Polecane posty

Witam. Szukam kogoś kto mi zrobi i wrzuci pasek dotacji na stronę. Ma on działać następująco. Wpisujemy daną kwotę do zebrania która będzie pokazana na pasku jako 100% Gdy ktoś dokona darowizny ja w kodzie będę wprowadzał tą kwotę i na pasku powinna się ona zmienić w procenty. Dobrze by było aby pasek też zmieniał kolor. Np. od 0-50% czerwony od 50-75% żółty od 75-100% zielony.

 

Budżet: 30zł?

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
Gość Spoofy

Jedno zero jeszcze i biorę się za robotę.

 

Albo za te dotacje :D

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

<?php
$kwota_do_zebrania = 100;
$kwota_zebrana = 20;
$procent = round(($kwota_zebrana/$kwota_do_zebrania)*100, 2);
echo '
<div style="background: red; width: 100%; height: 50px;">
<div style="width: '.$procent.'%; height: 50px; background: green;"></div>
</div>
';

?>
Edytowano przez wlodziu (zobacz historię edycji)

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

@up

Nic tylko pogratulować uczciwości.

 

@Dla tych co chcą dodawać zera

Pomyśl dopiero pisz.

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

@krzysiek02,

 

pod linkiem poniżej zamieszczam Ci kod na ładny, animowany pasek postępu który umieszczasz tylko po stronie frontnendu aplikacji (tj. kod html, javascript oraz CSS), nie potrzebujesz ingerować w pliki PHP. Do działania potrzebne jest jQuery, które zapewne na swojej stronie już posiadasz.

 

Jedyne co jest rozbieżne z Twoją prośbą to automatyczne wyliczanie procentów - musisz zrobić to sam na kalkulatorze a następnie zaokrąglić. :)

 

Procent wpisujesz tylko w jednym miejscu, w kodzie który wkleisz w miejscu gdzie pasek ma się pojawić:

<div class="meter animate">
	<span style="width: 80%"><span></span></span>
</div>

Kolory jak prosiłeś - czerwony, pomarańczowy oraz zielony.

 

Demo i skrypty do skopiowania pod linkiem obok -> https://jsfiddle.net/mjagsddx/

Edytowano przez xorg (zobacz historię edycji)

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

Bądź aktywny! Zaloguj się lub utwórz konto

Tylko zarejestrowani użytkownicy mogą komentować zawartość tej strony

Utwórz konto

Zarejestruj nowe konto, to proste!

Zarejestruj nowe konto

Zaloguj się

Posiadasz własne konto? Użyj go!

Zaloguj się


×