Het maken van 'n dropdown menu
30 december 2010 - 12:03   
geplaatst door: Kapotlood
Nu zag ik op deze website een dropdown menu waarvan ik geen idee heb hoe zoiets gemaakt is. Het is een "gewoon" ogend menu waarbij het dropdown gedeelte óm de button zelf lijkt te lopen. Bij normale dropdowns valt dat deel gewoon onder de button, maar de manier zoals het in de bovenstaande link is gedaan ken ik nog niet.

Heeft iemand toevallig een idee hoe zoiets gemaakt is, of weet je misschien een tutorial over dit specifieke type dropdown menu?

Alvast bedankt! :-)

Het maken van 'n dropdown menu
30 december 2010 - 13:41    reactie #1
geplaatst door: bertvanderveen
Als je de code bekijkt lijkt het op HTML5 en CSS3. Zoek op "hover and focus" en je vindt denkelijk de nodige info.
Ik heb trouwens net in huis: CSS3 for Web Designers van Dan Cederholm (A Book Apart) en daar staat een vergelijkbare case in. Dat boekje kun je ook als ePub kopenÂ…


Aanvulling: Ik ontdek net dat die Dribble-site door Dan Cederholm gemaakt is!

(Bewerkt door bertvanderveen om 13:51, 30-12-2010)

Bert Vanderveen [...]
+++ Applegebruiker sinds 1989 (van System 6 via OSX naar macOS 15)
Het maken van 'n dropdown menu
30 december 2010 - 14:20    reactie #2
geplaatst door: Kapotlood
En weet je wat nou het leuke is? Ik doelde eigenlijk niet op de site,
maar op 't plaatje :tounge:

De dropdown menuutjes lijken wel erg op elkaar, maar die van
het plaatje op (het groene dropdown menuutje) valt om z'n eigen button
heen. Die van Dribbble zelf is voor zover ik kan zien niet meer dan een
normaal dropdown menu wat heel mooi gestyled is :-)

Ik heb ook al zitten loeren naar CSS3 for Web Designers... heb een paar
boeken liggen over o.a. Blog design waar hij volgens mij ook aan gewerkt
heeft, en 't zijn altijd boeken die overal aardig diep op in gaan zonder
dat ze in een buitenaarde taal beginnen te schrijven, hehe.

Mvg,
Joram