Plaatje (knop) met tekst uit de database

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Twan T

Twan T

02/09/2009 23:03:00
Quote Anchor link
Voor een website wil ik knoppen kunnen tonen wat eigenlijk plaatjes zijn:
Zie het als volgt:

rode knop (cirkel)
groen knop (vierkant)
blauwe knop (driekhoek)

Vervolgens moeten in deze knoppen texten uit de database komen.

Wat is hier de beste methode voor? Gebruik maken van plaatjes en daar tekst over heen zetten (zo ja hoe doe ik dit) of misschien Ajax oid gebruiken maar kan iemand verwijzen naar een tutotrial / boek waar ik dit in kan vinden.
 
PHP hulp

PHP hulp

07/05/2021 00:36:42
 
Jan Koehoorn

Jan Koehoorn

02/09/2009 23:22:00
Quote Anchor link
De teksten gewoon in een divje zetten en met CSS de goede background-image toewijzen.
 
Mitchell

Mitchell

03/09/2009 09:29:00
Quote Anchor link
3 anchors maken en die een background geven, is totaal niet moeilijk. Je kan ook buttons (<button>) of submit input gebruiken, maar die zijn wat moeilijker.
Gewijzigd op 01/01/1970 01:00:00 door Mitchell
 
Twan T

Twan T

04/09/2009 09:06:00
Quote Anchor link
het lezen geslagen op w3c enz maar kom er
niet helemaal uit.
Mijn plaatje is 75 pixels bij 75 pixels. Niet de text maar het plaatje
moet bepalend voor het formaat zijn.

Ik krijg dit nog niet voor elkaar het volgende heb ik tot nu toe.

<table>
<tr>
<td width="75" height="75"><div style="background-image:
url(images/buttons/group.png); background-repeat:repeat-n;
size:">Groep 1</div></td>
</tr>
</table>


Op deze manier zie ik maar een klein deel van het plaatje namelijk het formaat dat de tekst is.
Gewijzigd op 01/01/1970 01:00:00 door Twan T
 
Jan Koehoorn

Jan Koehoorn

04/09/2009 09:22:00
Quote Anchor link
Bedoel je zoiets?
http://www.jankoehoorn.nl/text_over_images.php

Zo ja, hier de broncode. Aanpassen naar je eigen situatie uiteraard.
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?php
    ini_set ('display_errors', 1);
    error_reporting (E_ALL | E_STRICT);
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <style type="text/css" media="screen">
        li                    {border: 1px solid #ccc; float: left; display: inline; text-align: center; color: white; font-weight: bold;}
    </style>
</head>

<body>
    <ul style="list-style-type: none; margin: 0; padding: 0;">
    <?php
        $i
= 1;
        foreach (glob ('imagick/s/*.jpg') as $img) {
            list ($w, $h) = getimagesize ($img);
            echo '
                <li style="line-height: '
. $h . 'px; background-image: url(' . $img . '); width: ' . $w . 'px; height: ' . $h . 'px;">Hier tekst ' . $i++ . '</li>
            '
;
        }

    ?>

    </ul>
</body>
</html>
 
Twan T

Twan T

04/09/2009 09:28:00
Quote Anchor link
Ja zo ongeveer inderdaad, echter moeten ook de teksten in verschillende stylen kunnen worden getoond.

Maar dit moet wel weer een stuk in de juiste richting komen.
 
Jan Koehoorn

Jan Koehoorn

04/09/2009 09:43:00
Quote Anchor link
Je kunt een span om je tekst heen zitten met een inline style erin. Of CSS classes gebruiken, als je maar een paar tekststyles nodig hebt.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.