Menu met diepte
Ik ben een vrijwilliger bij een organisatie. Mijn taak is om de website te onderhouden. Iemand anders heeft de website al gemaakt, maar er zijn veel dingen aan te verbeteren. Zo heb ik de CMS al wat gebruiksvriendelijker gemaakt, maar de voorkant klopt ook niet helemaal.
Zo is het menu een plaatje, dat eens een keer door iemand gemaakt is. Daar staan nog allemaal oude dingen in. Zo moet "Agenda" veranderd worden naar "Nieuws", en moet er een leeg vak opgevuld worden.
Ik heb een aantal dingen geprobeerd met photoshop, maar dat lukte niet helemaal.
Het menu ziet er als volgt uit:
Het menu in de index.php file was al als volgt:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
<img src="/images/menu.png" id="image_menu" alt="menu" width="305" height="670" usemap="#main_menu"/>
<map id="main_menu" name="main_menu" >
<area shape="poly" coords="65,198,229,228,229,265,65,245" href="/" alt="Begin pagina" title="Begin pagina"/>
<area shape="poly" coords="46,254,208,274,208,309,46,298" href="/informatie/" alt="Informatie" title="Informatie"/>
<area shape="poly" coords="65,308,224,320,224,354,65,352" href="/nieuws/" alt="Nieuws" title="Nieuws"/>
<area shape="poly" coords="48,358,205,362,204,394,48,398" href="/javascript-benodigd/" onclick="popup_show('popup_verlengen');return(false)" alt="Foto's" title="Verlengen"/>
<area shape="poly" coords="73,398,227,394,228,429,74,440" href="/catalogus/" alt="Catalogus" title="Catalogus"/>
<area shape="poly" coords="70,449,296,428,297,462,70,488" href="/javascript-benodigd/" onclick="popup_show('popup_ideeenbus');return(false)" alt="Ideenbus" title="Ideenbus" />
<area shape="poly" coords="108,494,258,476,258,509,108,534" href="/fotos/" alt="Foto's" title="Foto's" />
<area shape="poly" coords="60,536,96,530,108,536,210,519,210,542,61,574" href="/vrijwilligers/" alt="Vrijwilligers" title="Vrijwilligers" />
<area shape="poly" coords="45,578,192,548,192,578,47,614" href="/link-pagina/" alt="Link Pagina" title="Link Pagina" />
<area shape="poly" coords="80,626,225,589,226,619,81,661" href="/nieuwsbrief/" alt="Nieuwsbrief" title="Nieuwsbrief"/>
<area shape="rect" coords="0,0,305,670" nohref="nohref" alt="" />
</map>
<map id="main_menu" name="main_menu" >
<area shape="poly" coords="65,198,229,228,229,265,65,245" href="/" alt="Begin pagina" title="Begin pagina"/>
<area shape="poly" coords="46,254,208,274,208,309,46,298" href="/informatie/" alt="Informatie" title="Informatie"/>
<area shape="poly" coords="65,308,224,320,224,354,65,352" href="/nieuws/" alt="Nieuws" title="Nieuws"/>
<area shape="poly" coords="48,358,205,362,204,394,48,398" href="/javascript-benodigd/" onclick="popup_show('popup_verlengen');return(false)" alt="Foto's" title="Verlengen"/>
<area shape="poly" coords="73,398,227,394,228,429,74,440" href="/catalogus/" alt="Catalogus" title="Catalogus"/>
<area shape="poly" coords="70,449,296,428,297,462,70,488" href="/javascript-benodigd/" onclick="popup_show('popup_ideeenbus');return(false)" alt="Ideenbus" title="Ideenbus" />
<area shape="poly" coords="108,494,258,476,258,509,108,534" href="/fotos/" alt="Foto's" title="Foto's" />
<area shape="poly" coords="60,536,96,530,108,536,210,519,210,542,61,574" href="/vrijwilligers/" alt="Vrijwilligers" title="Vrijwilligers" />
<area shape="poly" coords="45,578,192,548,192,578,47,614" href="/link-pagina/" alt="Link Pagina" title="Link Pagina" />
<area shape="poly" coords="80,626,225,589,226,619,81,661" href="/nieuwsbrief/" alt="Nieuwsbrief" title="Nieuwsbrief"/>
<area shape="rect" coords="0,0,305,670" nohref="nohref" alt="" />
</map>
Ik heb nu dus een leeg menu. Kan ik met CSS, bijvoorbeeld met die coördinaten, de "vlakken" maken, en dan zorgen dat de tekst met de diepte mee loopt?
Heb nergens iets kunnen vinden.. Of is er ook een mogenlijkheid zonder CSS te gebruiken?
Machiel.
Er zijn nog geen reacties op dit bericht.