Responsive Menu Extension

In this section you can share self-made extensions with other users of WYSIWYG Web Builder.

There are already more than 250 extensions available!
Post Reply
User avatar
Patrik iden
 
 
Posts: 585
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Responsive Menu Extension

Post by Patrik iden » Wed Jan 28, 2015 9:53 pm

I have now made another Extension (Multi responsive menu, this menu has one level dropdown/sub menu. You can find it here:
http://www.wysiwygwebbuilder.com/forum/ ... 42&t=66626


Hello, i have made this responsive navigation "Responsive Menu". I havent tested it to much, so if any one whant to help me and sugest improvments that will be great. I include all the sorce and project files so that anyone can make changes/improvments. Thank you.

If any one make any changes to this Extension please share and rename the Extension file to: responsive_menu_your_wwb_forum_username.rar

Original script: Sergio Vitov / http://responsivemobilemenu.com/en/

I also used the Extension: Lava-Lamp Style Navigation Menu by Erkan OZ to get started. Thank you.

Demo: None Gradiant Menu: http://test3.fcab.se/myextensions/respo ... /menu.html

Demo: Gradiant and borders: http://test3.fcab.se/myextensions/respo ... /menu.html

Update version 2.0.0.0, please download againe. You must use WWB version 10.3+ for the menu to work!

Updates: Before 2015-03-03

1. I removed the category "General" and moved those propertys to the Menu category.
2. In the Menu category i also added the possibility to remove the jQuery 1.11.1 script (this script can interfere with the WWB slidshow script).
3. I added a Category "Visibility" in here you can choose to hide the Menu att specific Media screen sizes. You can set (min or max Media screen width, and you can set the Media screen width, and you have to setup to hide or to show the menu).

Updates: 2015-03-04

1. You can now have the menu fixed to top even if you scroll the page.
2. You can now have php code in the menu (eg, if you want to get the menu link text from a php file you can have this: <?echo utf8_encode ($lang['MENU_HOME']); ?>
3. The menu code will now end up just befor the </body> tag but outside of the container element, so it's no longer between the <head></head> tag.

Update: 2015-03-19

1. Now you can choose not to show text shadows. I added a setting in: Properties/Menu/Use text shadow, here you can choose Yes or No. No will remove the text shadow from all texts in the menu. Yes will put it back. It wont mater if you have setup text shadow in the other settings, this option (No) will override them. If you set it to Yes the text shadow settings you have setup for the texts will be in effect again.

Update: 2015-03-25

1. You can now change position (from top) for the menu.

Update: 2015-04-16

1. Gradient background colors.
2. Border size and radius on the links/button in the bigscreen mode menu. I did not add this function for the mobile menu mode.
3. In mobile menu mode. I'v added a function to remove the top/bottom/(left/right deviders) borders on the active link. I think it looks better to remove these if you have an outstanding color.
4. I have also added a function to controll when the menu should toggle to the mobile menu. If you drag your window and look at when the menu toggles to the mobile menu you will see-
that there are some gaps on the left/right side of the bigscreen menu. It is this gap you now have some controll over. Default settings in the script is 1.05 try changing it to eg, 1.0

Update: 2015-04-18

1. I have added function to set different text color on active/current link.

2. Finally :) You can now have the menu in an master page, then just use master object to insert the menu from master page.
Now you can just make changes to the menu in the master page and these changes will be updated in all other pages.
The nice thing about this menu is that you now can choose to indicate Active/Current page by setting up a background color just for this directly in the master page.
If you do not want any Active/Current indicator color on your links/buttons you can turn this function of.

3. I just made a little change: Now you can controll to remove separatly the top and bottom devider/border on active links in the mobile menu (in mobile mode). I made this update because in some cases it will look better not to remove eg, the bottom border and in some it will, depends on the colors you are using.

If there is some one out here that are good at making menus like this, please let me know. Could use some help to add sublinks/dropdown menu.

Thank you.

Download Version 2.0.0.0: https://mega.nz/#!pwEVwSZa!nY4w4i2EFQTi ... AqHFBubbCY
Last edited by Patrik iden on Wed Mar 21, 2018 10:41 am, edited 26 times in total.

haakoo
 
 
Posts: 290
Joined: Fri Apr 25, 2008 8:02 am
Location: Groningen/NL

Re: Responsive Menu Extension

Post by haakoo » Wed Jan 28, 2015 10:42 pm

Nice,thanks for sharing

Hans

electrochrisso
 
 
Posts: 84
Joined: Mon Aug 19, 2013 8:39 am
Location: Darling River

Re: Responsive Menu Extension

Post by electrochrisso » Fri Jan 30, 2015 12:11 am

8) Thanks from me too.

Chris
WYSIWYG THE GREATEST Web Builder EVER

User avatar
Patrik iden
 
 
Posts: 585
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Fri Jan 30, 2015 2:37 am

haakoo wrote:Nice,thanks for sharing

Hans
Minor changes now in version 1.0.0.1, please download againe.

User avatar
Patrik iden
 
 
Posts: 585
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Fri Jan 30, 2015 2:38 am

electrochrisso wrote:8) Thanks from me too.

Chris
Minor changes now in version 1.0.0.1, please download againe.

electrochrisso
 
 
Posts: 84
Joined: Mon Aug 19, 2013 8:39 am
Location: Darling River

Re: Responsive Menu Extension

Post by electrochrisso » Mon Feb 02, 2015 2:15 am

Patrik iden wrote:
electrochrisso wrote:8) Thanks from me too.

Chris
Minor changes now in version 1.0.0.1, please download againe.
Done. :)
WYSIWYG THE GREATEST Web Builder EVER

User avatar
miguelss
 
 
Posts: 58
Joined: Thu Aug 15, 2013 12:25 pm
Location: Madrid, Spain
Contact:

Re: Responsive Menu Extension

Post by miguelss » Mon Feb 02, 2015 8:57 am

Hi Patrik iden!

Thanks for your time and effort, and of course...for sharing!
Cheers!

M.

andyp
 
 
Posts: 417
Joined: Fri Aug 08, 2014 8:56 am
Location: Brighton UK
Contact:

Re: Responsive Menu Extension

Post by andyp » Tue Feb 03, 2015 9:16 pm

This is really good for people like myself who are newbies to Responsive Design.... so thanks very much.

At the moment I have one question:

Is it possible to remove the text shadow option and if so how can this be achieved?

Thanks
AP
Making mistakes....and still learning as I go along.. and very grateful to those who know far more than me... :)
http://www.apgraphx.co.uk

User avatar
Patrik iden
 
 
Posts: 585
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Tue Feb 03, 2015 11:58 pm

andyp wrote:This is really good for people like myself who are newbies to Responsive Design.... so thanks very much.

At the moment I have one question:

Is it possible to remove the text shadow option and if so how can this be achieved?

Thanks
AP
Hello in version 1.0.0.2 you can remove the text shadow. Please download againe: https://dl.dropboxusercontent.com/u/318 ... e_menu.rar
Last edited by Patrik iden on Thu Mar 12, 2015 3:47 pm, edited 1 time in total.

andyp
 
 
Posts: 417
Joined: Fri Aug 08, 2014 8:56 am
Location: Brighton UK
Contact:

Re: Responsive Menu Extension

Post by andyp » Wed Feb 04, 2015 12:05 am

Great.. thanks very much
Making mistakes....and still learning as I go along.. and very grateful to those who know far more than me... :)
http://www.apgraphx.co.uk

andyp
 
 
Posts: 417
Joined: Fri Aug 08, 2014 8:56 am
Location: Brighton UK
Contact:

Re: Responsive Menu Extension

Post by andyp » Wed Feb 04, 2015 12:45 am

I dont think that the 'menu hover' action is functioning?
Making mistakes....and still learning as I go along.. and very grateful to those who know far more than me... :)
http://www.apgraphx.co.uk

User avatar
Patrik iden
 
 
Posts: 585
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Wed Feb 04, 2015 2:24 am

andyp wrote:I dont think that the 'menu hover' action is functioning?
It works for me, have you publiched the page so i can take a look?

andyp
 
 
Posts: 417
Joined: Fri Aug 08, 2014 8:56 am
Location: Brighton UK
Contact:

Re: Responsive Menu Extension

Post by andyp » Wed Feb 04, 2015 11:18 am

Thanks for the reply... no not yet... I am just experimenting with RD at the moment... although I will upload something later today.

Thanks
Making mistakes....and still learning as I go along.. and very grateful to those who know far more than me... :)
http://www.apgraphx.co.uk

User avatar
Patrik iden
 
 
Posts: 585
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Responsive Menu Extension

Post by Patrik iden » Sun Feb 08, 2015 2:14 am

Updates:

1. I removed the category "General" and moved those propertys to the Menu category.
2. In the Menu category i also added the possibility to remove the jQuery 1.11.1 script (this script can interfere with the WWB slidshow script).
3. I added a Category "Visibility" in here you can choose to hide the Menu att specific Media screen sizes. You can set (min or max Media screen width, and you can set the Media screen width, and you have to setup to hide or to show the menu).

Download: https://dl.dropboxusercontent.com/u/318 ... e_menu.rar
Last edited by Patrik iden on Thu Mar 12, 2015 3:47 pm, edited 1 time in total.

introflare
 
 
Posts: 27
Joined: Tue Jun 24, 2014 1:01 am

Re: Responsive Menu Extension

Post by introflare » Sun Feb 08, 2015 5:34 pm

anyone have a link to the menu you are talking about Lava-Lamp Style Navigation Menu by Erkan OZ

Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest