5 Sterne Bewertung

  • Hallo an alle,

    ich habe ein kleines Problem und hoffe mit eurer Hilfe auf eine Lösung.

    Es gibt viele Vorlagen für Sternebewertungen.
    Ich habe eine davon auch schon erfolgreich selbst angewendet. Es ging dabei um eine Punktzahl von 0 bis 100.
    Diese war denkbar einfach umzusetzen.

    als bsp:

    Code
    <div class="ratinginactive">
      <div class="ratingactive" style="width: 95px;"></div> 
    </div>

    Durch das style Attribut wird die Punktzahl angegeben und die Sterne dementsprechend auch angezeigt. Bei 50px wären das dann 2,5 Sterne usw.
    Alles mit Hilfe von 2 Grafiken.

    Code
    .ratinginactive {          
              width: 100px;
              height: 16px;
              float: left;
              background: url("rating-gray.png") repeat-x;
            }
            .ratingactive {
                height: 16px;
                background: url("rating-gold.png") repeat-x;
            }

    Mittels einer Datenbankabfrage konnte ich so das width Attribut für die verschiedenen Produkte einfach ersetzten und so automatisch die Bewertungen einfügen.

    Nun stehe ich aber etwas auf dem Schlauch. Für ein anderes Projekt bekomme ich ebenfalls eine Bewertung geliefert. Diese würde ich ebenfalls gerne mit Sternen grafisch Darstellen. Jedoch bekomme ich die Daten nur von 0 - 5. Also wenn ich im oben genannten Beispiel dort die px angeben würde, wären alle Bewertungen bei maximal 5% und das ist so gut wie nicht erkennbar...
    Gibt es eine Alternative wie man so etwas unkompliziert Regel könnte?

    Ich hoffe das Problem war verständlich und bedanke mich vorab schon einmal :)