Page 1 of 3
Responsive Menu Extension
Posted: Wed Jan 28, 2015 9:53 pm
by Patrik iden
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
Re: Responsive Menu Extension
Posted: Wed Jan 28, 2015 10:42 pm
by haakoo
Nice,thanks for sharing
Hans
Re: Responsive Menu Extension
Posted: Fri Jan 30, 2015 12:11 am
by electrochrisso
Thanks from me too.
Chris
Re: Responsive Menu Extension
Posted: Fri Jan 30, 2015 2:37 am
by Patrik iden
haakoo wrote:Nice,thanks for sharing
Hans
Minor changes now in version 1.0.0.1, please download againe.
Re: Responsive Menu Extension
Posted: Fri Jan 30, 2015 2:38 am
by Patrik iden
electrochrisso wrote: Thanks from me too.
Chris
Minor changes now in version 1.0.0.1, please download againe.
Re: Responsive Menu Extension
Posted: Mon Feb 02, 2015 2:15 am
by electrochrisso
Patrik iden wrote:electrochrisso wrote: Thanks from me too.
Chris
Minor changes now in version 1.0.0.1, please download againe.
Done.
Re: Responsive Menu Extension
Posted: Mon Feb 02, 2015 8:57 am
by miguelss
Hi Patrik iden!
Thanks for your time and effort, and of course...for sharing!
Cheers!
M.
Re: Responsive Menu Extension
Posted: Tue Feb 03, 2015 9:16 pm
by andyp
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
Re: Responsive Menu Extension
Posted: Tue Feb 03, 2015 11:58 pm
by Patrik iden
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
Re: Responsive Menu Extension
Posted: Wed Feb 04, 2015 12:05 am
by andyp
Great.. thanks very much
Re: Responsive Menu Extension
Posted: Wed Feb 04, 2015 12:45 am
by andyp
I dont think that the 'menu hover' action is functioning?
Re: Responsive Menu Extension
Posted: Wed Feb 04, 2015 2:24 am
by Patrik iden
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?
Re: Responsive Menu Extension
Posted: Wed Feb 04, 2015 11:18 am
by andyp
Thanks for the reply... no not yet... I am just experimenting with RD at the moment... although I will upload something later today.
Thanks
Re: Responsive Menu Extension
Posted: Sun Feb 08, 2015 2:14 am
by Patrik iden
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
Re: Responsive Menu Extension
Posted: Sun Feb 08, 2015 5:34 pm
by introflare
anyone have a link to the menu you are talking about Lava-Lamp Style Navigation Menu by Erkan OZ
Re: Responsive Menu Extension
Posted: Sun Feb 08, 2015 6:36 pm
by Patrik iden
introflare wrote:anyone have a link to the menu you are talking about Lava-Lamp Style Navigation Menu by Erkan OZ
viewtopic.php?f=42&t=33889
Re: Responsive Menu Extension
Posted: Sun Feb 08, 2015 7:39 pm
by mindentezzel
Thank you for this great menu.
I have a stupid question: Is it possible to give a bookmark instead of page link etc.?
T.
Re: Responsive Menu Extension
Posted: Sun Feb 15, 2015 2:27 am
by mindentezzel
Does somebody know how to put bookmark in this menu. If you put # in the menu the menu appears two time but the link does not work. How does it work with bookmark?
Re: Responsive Menu Extension
Posted: Wed Feb 18, 2015 10:31 am
by stamjoe
Hello Patrik
very usefull extension.
Is it possible to use it in an non responsible webpage?
Thanks
Joe
Re: Responsive Menu Extension
Posted: Wed Feb 18, 2015 1:43 pm
by Patrik iden
stamjoe wrote:Hello Patrik
very usefull extension.
Is it possible to use it in an non responsible webpage?
Thanks
Joe
Well, you dont have to use Breakpoints if thats what you mean? The way this menu works is: When the Links on the normal view do no longet fitt in the screen, then the (Mobile/Dropdown menu) will be shown.
Re: Responsive Menu Extension
Posted: Wed Feb 18, 2015 2:01 pm
by Patrik iden
mindentezzel wrote:Does somebody know how to put bookmark in this menu. If you put # in the menu the menu appears two time but the link does not work. How does it work with bookmark?
If you put # in the menu the menu appears two time but the link does not work. If you have moore than one menu eg. if you are using breakpoints, make shore you have the same values in all menus.
In the Extension bilder there is no option for bookmarks, but if you'd like i maybe can change the URL option to just be a input option, this way you can put in anything you'd like eg, ./index.html/bookmark1.
Re: Responsive Menu Extension
Posted: Wed Feb 18, 2015 3:12 pm
by stamjoe
Patrik iden wrote:stamjoe wrote:Hello Patrik
very usefull extension.
Is it possible to use it in an non responsible webpage?
Thanks
Joe
Well, you dont have to use Breakpoints if thats what you mean? The way this menu works is: When the Links on the normal view do no longet fitt in the screen, then the (Mobile/Dropdown menu) will be shown.
Thanks Patrik, i will give it a try!!!!
Re: Responsive Menu Extension
Posted: Fri Feb 20, 2015 11:06 pm
by mark_borman
A slightly different menu.
!Test version
http://www.wysiwygwebbuilder10.pl/menu_ ... index.html
IE WinXP-not ,Carusel-problem please <!--<script src="./jquery.min.js"></script>-->
Orginal
http://slicknav.com/css3demo/
Re: Responsive Menu Extension
Posted: Fri Feb 20, 2015 11:43 pm
by Patrik iden
What exactly is your question/problem?
Re: Responsive Menu Extension
Posted: Tue Feb 24, 2015 5:16 pm
by naftalina
thanks
Re: Responsive Menu Extension
Posted: Tue Mar 10, 2015 11:05 pm
by andyp
Hi
Can you remind me how to remove the text shadow?
I cant see how to deactivate it.. have latest version.....
Thanks
AndyP
Re: Responsive Menu Extension
Posted: Wed Mar 11, 2015 7:38 am
by Patrik iden
andyp wrote:Hi
Can you remind me how to remove the text shadow?
I cant see how to deactivate it.. have latest version.....
Thanks
AndyP
Can you just use the same color on the text shadow as the background color of menu?
Re: Responsive Menu Extension
Posted: Wed Mar 11, 2015 9:04 am
by andyp
Sure... but I thought at one time the facility to remove text shadow was added?
I recently removed all extension from WB... and then downloaded and reinstalled RME...
Thanks
AndyP
Re: Responsive Menu Extension
Posted: Wed Mar 11, 2015 9:22 am
by Patrik iden
andyp wrote:Sure... but I thought at one time the facility to remove text shadow was added?
I recently removed all extension from WB... and then downloaded and reinstalled RME...
Thanks
AndyP
Yes i think that setting where deletet some how, but it works by setting the same color as background color right?
Re: Responsive Menu Extension
Posted: Wed Mar 11, 2015 8:23 pm
by andyp
Yes... it does work in Firefox... but a little odd in my IE9
Also.... using the 'Remove Java script' for the slide show causes the menu to double up on size... duplicated.... and the slide show does not work?
The example above
http://laser4you.co.uk/test4/
Without using the 'Remove Java script it looks like this
http://laser4you.co.uk/test3
See video at:
http://www.apgraphx.co.uk/menu
First preview set to: Use Java Script - Slide Show not working
Second preview set to: Use Java Script: Jquery script removed - Causes double up on menu
Thanks
Andyp
Re: Responsive Menu Extension
Posted: Wed Mar 11, 2015 9:37 pm
by Patrik iden
You should only set the Use Javascript to no if you are using a slidshow on the same page. If you set the Use Javascript to no and do not use slideshow then the menu will double up.
So if you have the Slideshow the set Use Javascript to no.
If you do not have Slidshow then set Use Javascript to yes.
And by looking at your video it seems that you are not using the latest update?
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.
Download ver: 1.0.0.4 here:
https://dl.dropboxusercontent.com/u/318 ... e_menu.rar
Re: Responsive Menu Extension
Posted: Thu Mar 12, 2015 1:14 am
by andyp
Well... when I redownloaded the file earlier today I downloaded from a link in a previous post in the this thread.. so I have no idea how I ended up with the wrong version
I have had a quick look at it appears to be ok now..... however... I will say that using the same colour for text shadow as per the background really looks odd in IE
Did you remove the facility to disable text shadow as per a previous version???
Will look more into this later tonight.....
Thanks
AndyP
Re: Responsive Menu Extension
Posted: Thu Mar 12, 2015 4:00 pm
by Patrik iden
andyp wrote:Well... when I redownloaded the file earlier today I downloaded from a link in a previous post in the this thread.. so I have no idea how I ended up with the wrong version
I have had a quick look at it appears to be ok now..... however... I will say that using the same colour for text shadow as per the background really looks odd in IE
Did you remove the facility to disable text shadow as per a previous version???
Will look more into this later tonight.....
Thanks
AndyP
Looks fine to me in IE.
Re: Responsive Menu Extension
Posted: Sat Mar 14, 2015 11:04 pm
by andyp
Patrik iden wrote:
In the Extension bilder there is no option for bookmarks, but if you'd like i maybe can change the URL option to just be a input option, this way you can put in anything you'd like eg, ./index.html/bookmark1.
This would be very useful...
Thanks
AndyP
Re: Responsive Menu Extension
Posted: Sun Mar 15, 2015 12:09 am
by Patrik iden
andyp wrote:Patrik iden wrote:
In the Extension bilder there is no option for bookmarks, but if you'd like i maybe can change the URL option to just be a input option, this way you can put in anything you'd like eg, ./index.html/bookmark1.
This would be very useful...
Thanks
AndyP
But this is not necessary, you simply use external web address and make the link like this: ./you page#your bookmark or ./your page#wb_your id
Re: Responsive Menu Extension
Posted: Sun Mar 15, 2015 10:00 am
by andyp
Ok...
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 1:26 pm
by Patrik iden
Hello, are you using the most current update of WWB 10.3.2?
Are you using the most current update of the Responsive mnu 1.0.0.4?
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 2:40 pm
by naftalina
The Slide Show does not work when the menu is in the project?!
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 2:42 pm
by Patrik iden
naftalina wrote:The Slide Show does not work when the menu is in the project?!
To bouth of you. Turn of the javascript. If this dies not work, maybe some other java script/extension is in the way.
Demo page:
http://test3.fcab.se/myextensions/respo ... /menu.html
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 3:06 pm
by Patrik iden
madtim wrote:I've turned off the javascript with the menu now like this
http://www.madwebdesign.co.uk/2015proof ... eader.html and still not working on any pages. There is no content in the slideshow as yet and it was working previously with no problem before both updates.
Turn on the java script again, save project and Can you send me the project?
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 3:28 pm
by Patrik iden
madtim wrote:Patrik iden wrote:madtim wrote:I've turned off the javascript with the menu now like this
http://www.madwebdesign.co.uk/2015proof ... eader.html and still not working on any pages. There is no content in the slideshow as yet and it was working previously with no problem before both updates.
Turn on the java script again, save project and Can you send me the project?
No problem the zip is 10.5mb complete, pm me your email and I'll send it over now for you. Thank you for taking the time.
Email address removed.
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 3:52 pm
by Patrik iden
Hi, I'm not reciving the mail. Can you please remove my email from the quote in you last post?
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 4:29 pm
by Patrik iden
madtim wrote:Patrik iden wrote:Hi, I'm not reciving the mail. Can you please remove my email from the quote in you last post?
Checked on my server, the first didn't go through so I split the files into two zips and it says they have gone through, fingers crossed.
OK i got them, i'l take a look now.
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 6:29 pm
by Patrik iden
OK, it look's like there is a problem using Master fram. The only way i can think of to fix this is to make another masterpage eg, masters/menu and cut the menu from the masters/header page an past in place in the new masters/menu page.
Then on every page at the top you put in an Master object and use the masters/menu.
Or you maybe you can, move down all content in every page and use the masters/header page as an Master object on every page?.
Sorry i cant think of enything better.
Hope it works out for you. Just contact me if you have any more questions.
Regards
//Patrik.
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 6:58 pm
by Patrik iden
Another option would be to put the header and footer content inside the mainpage and then on every page eg, aboutus, you cut the current content and then you put in an Master object and use the mainpage as Master object, then you paste the content you cut from the aboutus page (and you will have to move this content down a bit). Now you can even remove the header and footer page.
Try all the option i given you and find out what option works best for you.
Have a nice evening and please get back to me with the result.
Regards.
//Patrik.
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 8:11 pm
by andyp
Just to say to Patrik.... having read these last posts.... you are a great guy for helping people out...
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 8:31 pm
by Patrik iden
andyp wrote:Just to say to Patrik.... having read these last posts.... you are a great guy for helping people out...
Thank you, I appreciate it
Re: Responsive Menu Extension
Posted: Wed Mar 18, 2015 10:41 pm
by andyp
We appreciate your efforts
Re: Responsive Menu Extension
Posted: Thu Mar 19, 2015 6:38 pm
by andyp
Hi Patrik...
On the subject of the text shadow... which once had the ability to disable... and now the only way to hide the text shadow is to set it to the same colour background....
What actually happens with this is that the shadow (set to the the same background colour) still shows when the hover function is used..
Meaning... black text on white backgound... set shadow to white to loose the shadow effect... have a different colour for hover....as you would... white set shadow is seen on hover
Is there any way around this because personally I am not at all keen on using shadow effects on text.....
Thanks
AndyP
Re: Responsive Menu Extension
Posted: Thu Mar 19, 2015 7:55 pm
by Patrik iden
Hello, Ok for now use this: Put in an HTML box and pick the type Between <head></head> tag and past in this code:
Code: Select all
<style>
.rmm.custom .rmm-toggled-title, .rmm.custom .rmm-main-list li a, #current_yes a
{
text-shadow: none !important;
}
</style>