Avatar billede ditlev Juniormester
05. september 2011 - 11:11 Der er 4 kommentarer og
1 løsning

Billede som knap

Kære eksperter
Jeg er ved at starte på et projekt, hvor jeg arbejder i PHP og HTML primært.
Jeg skal lave en funktionalitet, hvor jeg har et felt på 7x7 mindre felter. Hvert af de små felter skal være en knap, som kan være blank eller have en farve. Jeg forestiller mig at det kan være et billede der placeres i feltet, og hvis man klikker på billedet vil det blive skiftet ud med et billede der f.eks. har samme dimensioner men altså har en anden farve (lidt ligesom en radiobutton, men blot hvor et helt felt skifter farve).
Er der en smart måde at lave det på?
Jeg har lavet det i Flash for nogle år siden, men ønsker nu at prøve idéen af udenfor Flash.
Avatar billede majbom Novice
05. september 2011 - 11:48 #1
så ville jeg da nok anvende javascript - det lyder umiddelbart ret simpelt :)
Avatar billede huutt Nybegynder
05. september 2011 - 13:30 #2
Tænkte du på noget i denne stil?

<html>
<head>
    <title></title>
<script>
function SetBg(id,col) {
    document.getElementById(id).style.backgroundColor=col;
}
</script>   
</head>
<body>
<?php
    $vandret = 7;
    $lodret = 7;
   
    echo '<table cellspacing="1" cellpadding="1">';
        for ($i=0; $i<$lodret; $i++) {
            echo '<tr>';
                for ($n=0; $n<$vandret; $n++) {
                    // dit felt
                    echo "<td id=\"felt_".$i."_".$n."\" onClick=\"SetBg(this.id, '#000000');\" width=\"10\" height=\"10\" style=\"background-color: Blue;\"></td>";
                }
            echo '</tr>';
        }
    echo '</table>';
?>
</body>
</html>
Avatar billede ditlev Juniormester
05. september 2011 - 14:17 #3
Ja - lige præcis.
Skal udvides til at man kan vælge mellem f.eks. fire farver i et farvepanel, og når man klikker på en knap bliver den skiftevis farvet eller blank (slettet).
Avatar billede ditlev Juniormester
05. september 2011 - 14:19 #4
huutt - du har jo svaret, så opret et svar, så er pointene dine
Avatar billede huutt Nybegynder
06. september 2011 - 08:23 #5
Det var godt, her kommer så er svar flyvende
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester