Page 1 of 1
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 8:41 am
by wwonderfull
HGF wrote: Wed Jul 27, 2022 6:37 am
This is exactly what I want to achieve.
<style>
#FlexGrid2 .nav {
{
z-index: 9999;
}
<style>
the style tag ends with /style
so the code would be
Code: Select all
<style>
#FlexGrid2 .nav
{
z-index: 9999;
}
</style>
Now it is bound to work for sure.
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 11:43 am
by HGF
Unfortunately, I'm not successful, not even with the slash in front of style.
Maybe you can share the html code from where you have generated the screenshot you provided.
This would show me the position where to add the code.
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 12:37 pm
by wwonderfull
HGF wrote: Wed Jul 27, 2022 11:43 am
Unfortunately, I'm not successful, not even with the slash in front of style.
Maybe you can share the html code from where you have generated the screenshot you provided.
This would show me the position where to add the code.
Did you use the latest code I gave?
It has too work or I my self am confused what would go wrong.
I am checking your live website and see what changes has been made using the latest code
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 12:37 pm
by crispy68
In your demo page, I do not see the z-index:9999 in the code. Can you please update the demo online with your changes? When Wwonderfulls code is added it works.
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 12:43 pm
by wwonderfull
crispy68 wrote: Wed Jul 27, 2022 12:37 pm
In your demo page, I do not see the z-index:9999 in the code. Can you please update the demo online with your changes? When Wwonderfulls code is added it works.
Here is the live site link @crispy
https://mcwarrior.de/Dynamic-Menu-Test.php
I think even without the z-index it is fine when I view it on the browser how about you.
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 12:47 pm
by HGF
ooops, my apologies.
I did not upload the code
Yes, I can confirm, it is working now as expected.
Thank you very much to everybody.
HGF
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 12:51 pm
by wwonderfull
HGF wrote: Wed Jul 27, 2022 12:47 pm
ooops, my apologies.
I did not upload the code
Yes, I can confirm, it is working now as expected.
Thank you very much to everybody.
HGF
No problem
Btw please change that background red color, it looks dangerous for the eyes. You can use a lighter red if you have too. Just a suggestion...
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 1:01 pm
by HGF
Thanks for your feedback against the color. Red is the defined team color, good idea to make it lighter. Thank you all, you did a good job.
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Jul 27, 2022 1:16 pm
by crispy68
@wwonderfull, yes it is working now for me too
As for the color red and from a design view, I would suggest not doing a red background even if you make it lighter as it is harsh on the eyes. If your team colors are red then I would look to highlight other things on the page in red (ex: icons, Titles/Headings, logo, etc.)
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 11:45 am
by HGF
@wwonderful, @crispy68
Thank you very much for the design hints.
I've redesigned the pages and now it is definetly more user friendly.
https://mcwarrior.de/v2/pages_content/n ... einhau.php
In the page above I'm using Photo Gallery - Light Box Gallery - magnificpopup
In generell it is working okay.
My question: Is there a setting or maybe different extension for better mobile usage?
In PhotoGallery, if clicking on a thumbnail:
1. On mobil I would like to disable left/right arrows and to enable swiping.
2. On mobil I would like to get the image size as large as possible (best fitting to the mobile screen)
I searched the forum, maybe I searched for the wrong terms.
Can you help me
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 12:22 pm
by HGF
Hi all,
I downloaded "Mobile Touch Gallery". It seems, this is doing what I'm searching for.
HGF
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 1:53 pm
by wwonderfull
HGF wrote: Wed Aug 03, 2022 12:22 pm
Hi all,
I downloaded "Mobile Touch Gallery". It seems, this is doing what I'm searching for.
HGF
Use 100vh for the grids and set the background images to "do not repeat" and background size to "Cover" And instead of flex grid try to use layout grids. Menu text should be bold and font size 12 atleast and also there is text at the bottom as I can see that too.
just a tip
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 3:08 pm
by HGF
@wwonderfull, thank you very much for your hints. I much appreaciate your support!!
https://mcwarrior.de/v2/pages_content/n ... einhau.php
This is how it looks with the suggested changes. Much better in my opinion. I guess I need to rezise the background image.
Now I'll start to learn more about layout grids.
Regards HGF
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 4:06 pm
by HGF
@wwonderfull
This my first attempt with layout grid. It seems, in layout grid there are much more options available than in flex grid.
And mobiletouchgallery is working fine as well.
I'm just unsatisfied with the background image. I'll play more around with it.
https://mcwarrior.de/v2/pages_content/n ... au-exp.php
Regards HGF
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 5:04 pm
by wwonderfull
HGF wrote: Wed Aug 03, 2022 4:06 pm
@wwonderfull
This my first attempt with layout grid. It seems, in layout grid there are much more options available than in flex grid.
And mobiletouchgallery is working fine as well.
I'm just unsatisfied with the background image. I'll play more around with it.
https://mcwarrior.de/v2/pages_content/n ... au-exp.php
Regards HGF
The background image set it to "do not repeat" and background image size to "cover" for the start page, uber uns, anmelden and all the other pages using grid with background image. You can increase the top menu text size to 16 and make it bold along with login text button etc.
Re: How to bring an "embedded Page" to the top layer
Posted: Wed Aug 03, 2022 5:53 pm
by HGF
Jepp, thank you,
I've started with this page
https://mcwarrior.de/v2/pages_content/n ... au-exp.php
and will continue with the others.
Regards
HGF
Re: How to bring an "embedded Page" to the top layer
Posted: Thu Aug 04, 2022 11:55 am
by HGF
@wwonderfull
I've started to redesign all pages with LayoutGrid and the settings you suggested.
Maybe you can help me again
Whe using the Flexgrid the following script brought the menu structur always on top
<style>
#FlexGrid2 .nav
{
z-index: 9999;
}
</style>
When working with Layoutgrid, I changed "#FlexGrid2 .nav" to "#LayoutGrid2 .nav" as an example. But, now there are multiple Layout grids. It would be great, if you could provide me a sample how to modify the script to make it working.
Thank you in advance
HGF
Re: How to bring an "embedded Page" to the top layer
Posted: Thu Aug 04, 2022 12:34 pm
by wwonderfull
Can you show or submit a demo of the problem which was created. By seeing the project I can tell you what would be the new code for your grid. So share the domain demo link.
Re: How to bring an "embedded Page" to the top layer
Posted: Thu Aug 04, 2022 12:53 pm
by HGF
https://mcwarrior.de/
goto anmelden
Benutzername: wwonderfull
Passwort: wwonderfull
You will reach page:
https://mcwarrior.de/v2/pages_content/n_start_int.php
Click in menu item "Galerien"
The sub menu opens. but it is not on the top layer and it is impossible to select an sub item.
This happens, because in this page the menu is implemented via "embedded page".
With flexgrid you solved the problem by adding the html script:
<style>
#FlexGrid2 .nav
{
z-index: 9999;
}
</style>
Since we are working with LayoutGrids, I guess the script needs to be modified. I change #FlexGrid2 .nav with the current Object ID, but we have more than 1 LayoutGrids and I don't know, how the modified script should look like.
If I do NOT use" embedded page" but implement the menu directly in the LayoutGrid, it works fine. In order I have a lot of pages it would be more convenient to use a signle source (embedded page).
Note: Not all pages are already redesigned. I'm continue to work on it.
Thank you
Re: How to bring an "embedded Page" to the top layer
Posted: Thu Aug 04, 2022 1:03 pm
by wwonderfull
Got it.
Code: Select all
<style>
#wb_LayoutGrid1
{
z-index: 1000;
}
</style>
Re: How to bring an "embedded Page" to the top layer
Posted: Thu Aug 04, 2022 1:55 pm
by HGF
It works!
Thank you very much
Regards
HGF