Coffeecup website Menu - reveals...

Jun 7th, 2020 at 09:37 AM
User 2695940 Photo

John Ferguson
Registered User
148 posts

Hi everyone,
I am hoping that someone smarter than me can help me duplicate the hover effect used on the coffeecup website menu?

Thanks in advance,
John
John Ferguson
Website Design and Development
www.jf1.co
Jun 7th, 2020 at 01:30 PM
User 2885740 Photo

René
Registered User
61 posts

Hi John,

here's is a quick answer from me. Later this week I will improve it a bit and add it to the other things you find under the link in my signature.
Ciao, René
Attachments:
Jun 7th, 2020 at 02:17 PM
User 2699991 Photo

Wayan (Reetami's Dad)
Registered User
5,596 posts
Online Now

Hello John
First of all, which framework are you usibg for your project./
second
how many menu items do you require on the top bar?
third
how many items do you require in the dropdown mega menus
STUCK ON SOMETHING?
Learning by doing. Responsive Site Designer Tutorials
https://mawarputih.coffeecup.com/forms/contact-wayan/
Jun 8th, 2020 at 12:49 AM
User 2695940 Photo

John Ferguson
Registered User
148 posts

René wrote:
Hi John,

here's is a quick answer from me. Later this week I will improve it a bit and add it to the other things you find under the link in my signature.
Ciao, René


Thanks René, That is exactly what I was looking for. I haven't played with Materialize framework before but I think I'll have to give it a try. I also think I should be able to do something very similar in Foundation, which I usually use.

Thanks again for your help!
John
John Ferguson
Website Design and Development
www.jf1.co
Jun 8th, 2020 at 01:04 AM
User 2695940 Photo

John Ferguson
Registered User
148 posts

Wayan Jaya Space Cadet wrote:
Hello John
First of all, which framework are you usibg for your project./
second
how many menu items do you require on the top bar?
third
how many items do you require in the dropdown mega menus


I'm thinking 6 to 7 main menu items Wayan, with about 12 items in the revealed menu.
I'm using Foundation for my websites.

Thanks for your help!
John
John Ferguson
Website Design and Development
www.jf1.co
Jun 8th, 2020 at 03:23 AM
User 2699991 Photo

Wayan (Reetami's Dad)
Registered User
5,596 posts
Online Now

So only the one with the mega items ? The rest just normal?
STUCK ON SOMETHING?
Learning by doing. Responsive Site Designer Tutorials
https://mawarputih.coffeecup.com/forms/contact-wayan/
Jun 8th, 2020 at 03:23 AM
User 2699991 Photo

Wayan (Reetami's Dad)
Registered User
5,596 posts
Online Now

So only the one with the mega items ? The rest just normal?
STUCK ON SOMETHING?
Learning by doing. Responsive Site Designer Tutorials
https://mawarputih.coffeecup.com/forms/contact-wayan/
Jun 8th, 2020 at 04:12 AM
User 2695940 Photo

John Ferguson
Registered User
148 posts

Hi Wayan,

No, 3 of the menu items will have the Mega menu, only one has 12 items and the other 2 have 7 items.

It will be very similar to what René has provided.

John Ferguson
Website Design and Development
www.jf1.co
Jun 8th, 2020 at 06:26 AM
User 2699991 Photo

Wayan (Reetami's Dad)
Registered User
5,596 posts
Online Now

John Ferguson wrote:
Hi Wayan,

No, 3 of the menu items will have the Mega menu, only one has 12 items and the other 2 have 7 items.

It will be very similar to what René has provided.


Ha Ha it won't be similar to what Rene' has done which is really good actually but "materialize !!"

here is an example of something I put together using "foundation', I use something similar on my own site, but not so many links inside the reveal container.
It may need a biot more polishing, especially for IE11, but it is mobile friendly, fully responsive
take a looksee & let me know if it's anywhere near

http://rsd-tutorialscom.coffeecup.com/index.html
STUCK ON SOMETHING?
Learning by doing. Responsive Site Designer Tutorials
https://mawarputih.coffeecup.com/forms/contact-wayan/
Jun 8th, 2020 at 07:01 AM
User 2699991 Photo

Wayan (Reetami's Dad)
Registered User
5,596 posts
Online Now

Actually I forgot to mention that they do not work on hover because mobile devices don't have that luxury yet so they are on click.but easily changed if you really want on hover
STUCK ON SOMETHING?
Learning by doing. Responsive Site Designer Tutorials
https://mawarputih.coffeecup.com/forms/contact-wayan/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.