Viewing Two Level Drop Down Mobile Navigation - everwebcodebox
Two Level Drop Down Mobile Navigation - everwebcodebox
|
User: Christopher 11 years ago
|
|
|
Deleted. I'll figure it out.
Last edit 11 years ago ------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
|
User: Roddy 11 years ago
|
|
|
This widget creates a click drop navigation block for mobile devices… http://everwebcodebox.com/html5/navigation/click-nav.html … and can be used in conjunction with this CTA button for top level items… http://everwebcodebox.com/html5/navigation/button-link.html ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Christopher 11 years ago
|
|
|
I've been running into all sorts of problems trying to implement this. Firstly, if I copy the code from your website and paste it into textedit, and then copy it from there (with or without amendments) and paste that into EW, it doesn't read the CSS. However, through much trial and error, I realized that if I copy directly from your website and paste that straight into EW, it works. So now I have to do that, and copy that into textedit to make amendments, and roundtrip that way. Secondly, your link above shows me something in development. Not yet ready for purchase, huh? I'm trying to put 2 navigations on the page. One, the Mobile Popup navigation for general navigating. Works like a charm. But when I try add the Two Level Drop Down Mobile navigation onto the same page (for a catalogue of movies: features, docs, shorts, etc.), the CSS conflicts with the above. The names and classes are all different, so I'm not understanding why yet. I'll keep trying to problem solve. But I sure wish EW offered at least one form of mobile navigation. It's quite surprising to me that it doesn't. Without Roddy's everwebcode box, which is a treasure trove of information, we'd be extremely limited in knowing what to do. Roddy, you rock! ------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
|
User: Christopher 11 years ago
|
|
|
Me again. I'm getting it to work but have a question about customization. Here's the link for reference: 1) I'm using a master mobile page with fixed header, content height and footer. The navigation fits nicely on the page, but when some of the drop downs open (i.e. Photo Galleries), everything spills out overtop of the footer. The HTML snippet widget has allow free-dragging deselected. Is there a way for the tabs to just push down on the footer and stay on the page? 2) I've made the background transparent with rgba and have been experimenting with putting a picture behind the navigation. But once I add items to the list and some of the panels drop down, there's going to be a lot of empty space. I was wondering if it were possible to a) place another picture that only becomes visible when the drop down extends in height; or b) to use one long vertical pic that unveils with the drop down. Make sense? Thanks! Last edit 11 years ago ------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
|
User: Christopher 11 years ago
|
|
|
Here's the some pics. (The png's didn't work once again.)
Last edit 11 years ago ------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
|
User: Christopher 11 years ago
|
|
|
Last try...
------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
 pic2.jpg See the spill over? |
|
|
User: Roddy 11 years ago
|
|
|
EverWeb fixes all the items on a page with absolute positioning - including the footer - to allow you to drag and drop stuff. You need increase the page content height to suit the navigation. A better option would be to create a dead link at the bottom of the actual menu and insert your © notice in it. Using background and shape images should be avoided at all costs on a mobile site so it doesn't make sense on a navigation in terms of increased download time and impaired readability. There are lots of places to showcase artistic talent without compromising the performance of the website. Background images rarely add anything of value to a website and usually end up making them a lot worse. Decide whether you want the navigation to encourage visitors to browse your website, a work of art or an unnecessary distraction. ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Christopher 11 years ago
|
|
|
Quote: Roddy - 16/10/2014 4:38:28 EverWeb fixes all the items on a page with absolute positioning - including the footer - to allow you to drag and drop stuff. This is a little confusing to me because I can build a page using the Master-Mobile page I've created (with fixed height) and if I add lots of content, the footer 'pushes down' to accommodate. Is there no way I can apply the same physics to a navigation bar? Last edit 11 years ago ------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
|
User: Roddy 11 years ago
|
|
|
The content you add is static and the footer is dragged down to another static position. The navigation is dynamic. It cannot "push" static content. It can only slide over or under it depending on the stacking order (z-index) of the various objects. ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Christopher 11 years ago
|
|
|
I can't for the life of me figure out to how to make the background 'padding?' equal around the navigation blocks and text. Or to essentially centre the navigation. See photo. Thanks :)
------------------------------- rMBP 15", 2.6 Ghz, 16 GB RAM, OS X 10.11.6, with 27" Thunderbolt Cinema Display www.cleetche.com |
|
 Screen Shot 2014-10-28 at 9.25.22 AM.jpg This continues to change as I add more lines of navigation |
|
|
User: Roddy 11 years ago
|
|
|
It looks like you have been trying to move the whole drop down away from the icon and adjusted the wrong value. You would need to show me the CSS to see what's up. As far as centering the navigation is concerned, it's not meant to move away from the icon so that it will work on hover. You need to revert to the default absolute position and move the icon to the right. I improved the way in which it works for the widget so that it is click to open and close on mobiles… http://everwebcodebox.com/html5/navigation/icon-nav.html If you use this method then the drop down can be moved horizontally away from the icon. ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
| Post Reply |
| You must login or signup to post. |