Jump to content
Latest News: (loading..)

Recommended Posts

Share this post


Link to post
Share on other sites

@@ringo667

 

I don't know what you have done exactly but as @@dinopacha says the dropdowns won't work between 768px and 992px.

I see you also added a manufacturers select dropdown, nice. Could that be the reason for the menu to not work properly? Try to remove that manufacturers dropdown once or post your code here. Or more better use pastebin.com and post your code there and link to it then. TO post long codes in a topic is always difficult to read.

 

@@Dan Cole

 

Thanks Dan. But credit belongs to GL Walker. He did the hardest part.

Share this post


Link to post
Share on other sites

@@dinopacha and all the others.

 

Here is a new prototype Menu for sm and xs view mode.

Will asked if it would be possible to change the breakpoint of the menu so that it collapses already in SM mode and it was possible with the css code I posted earlier but it also changes the breakpoint for the stock navbar at the top which I didn't like. So I looked around for an alternative menu and I found one that I liked and I created an additional module with it.

That new menu is suppose to extend the current Horizontal Menu BS but it could be used as stand alone too if necessary.

So while you browse in md or lg viewport you have the normal Horizontal Menu BS and when you go below 992px which is SM then you see the new Categories Menu XS.

This new menu features a couple cool transitions that can be switched from the admin area. I am not really satisfied with that switch but it will do for now.

 

So here it is, the new, additional Categories Menu XS. This package is not final and I will keep try to improve the code or clean it up more.

 

Categories Menu XS.zip

Edited by Tsimi

Share this post


Link to post
Share on other sites

@@ringo667

 

 dropdowns won't work between 768px and 992px.

I see you also added a manufacturers select dropdown, nice. Could that be the reason for the menu to not work properly? Try to remove that manufacturers dropdown once or post your code here.

 

 

only on Home dropdowns won't work between 768px and 992px product_info.php an category Pages it works.

 

I have remove the Drop Down, that´s not the Problem.

I have remove the carusell Banner, that´s also not the Problem.

Share this post


Link to post
Share on other sites

@@ringo667

 

Then there is only one thing to do, post your code.

 

We need to see the

 

.../classes/catmenu.php

.../templates/catmenu.php

 

files.

 

And don't forget to change the Button text from Categories to Kategorien or Produkte.

Edited by Tsimi

Share this post


Link to post
Share on other sites

Here a newer Version of that Categories Menu XS.

 

Added borders for better view and hover color.

Also changed the instructions for Step 3 now no need to touch the other file to switch between the menus.

Added Version number to the package to keep easier track.

 

Categories Menu XS_ver1.0.zip

 

Share this post


Link to post
Share on other sites

@@Tsimi,

 

This look great, :thumbsup:

 

I have removed the style and the js from the catmenu.php

 

.../templates/catmenu.php

 

You can do a lot with this menu.

you can even make it fixed instead of relative so the menu goes down with you if you scroll on a Phone. :shifty: ​ 

Share this post


Link to post
Share on other sites

@@ringo667

 

I looked at your codes. Hidding the manufacturers dropdown by using hidden-sm and hidden-md will not do the trick. Try and remove that code completely and tell me if it works then. With remove completely I mean delete the code from  <div class="hidden-sm hidden-md pull-right"><center> to </center></div> that whole piece -> delete. (Of course backup that file first just in case.)

 

When I remove that whole code it works just fine so it must be that part that causes the problem.

It is difficult to fix though since I don't use Enable/Disable Categories and that manufacturers dropdown, is that some kinda Addon?

Share this post


Link to post
Share on other sites

Problem is fixed :-) It had nothing to do with this module....

 

maybe a wrong div Container has Blocked the inks

 

<div class="clearfix"></div>  after   echo $oscTemplate->getContent('header'); has solved this Problem.

Share this post


Link to post
Share on other sites

@@Tsimi , @@GLWalker , et el ...

 

I have been using this on one site since the original code was posted by @@GLWalker ( http://forums.oscommerce.com/topic/398284-oscommerce-23-bootstrap-nav-menu/), and am now trying to implement it in a new site. On this new site, one category has many (over 40) sub-categories. This displays fine in XS mode, but in SM mode, the drop-down box stops at the bottom of the visible screen. There is no scroll bar to be able to scroll down and see the remainder of the sub-categories.

 

Any suggestions? :wacko:

 

Malcolm


If you are running the "official" osC 2.3.4 or 2.3.4.1 download, your installation is obsolete! Get the latest community-supported responsive "Edge" release here

Share this post


Link to post
Share on other sites

Likewise ...

 

Still in SM mode, If there are many levels of sub-categories, as each sub-menu expands to the right, a sub-sub-menu may push off the right side of the screen ... Without a left/right scroll bar, this sub-sub-menu may also be inaccessible.

 

Malcolm


If you are running the "official" osC 2.3.4 or 2.3.4.1 download, your installation is obsolete! Get the latest community-supported responsive "Edge" release here

Share this post


Link to post
Share on other sites

@@dinopacha

 

Thank you. Now ...

 

If I put the Overflow: Scroll; within the dropdown box, the scrollbar is within every dropdown box, even those that don't overflow. Where can I add this to the CSS so that when the dropdown box is larger than the visible screen, a scrollbar is added to the *screen*, not the dropdown box?

 

Thanks again!

 

Malcolm

 

PS: I addressed the left/right issue by changing the CSS so that the dropdown menus overlapped by xx%, rather than shifting left 100% each time.


If you are running the "official" osC 2.3.4 or 2.3.4.1 download, your installation is obsolete! Get the latest community-supported responsive "Edge" release here

Share this post


Link to post
Share on other sites

*** Update ***

 

To make something else work the way I wanted, I used a 'trick' of giving one CSS item (in my case, #columnLeft ) a padding-bottom: 999999px;  and then gave the #bodyWrapper a CSS entry of overflow-y: hidden;. 

 

Since the dropdown menu is within the #bodyWrapper, I'm seeing a conflict. Hmmmmm .....

 

Malcolm

 

 

*** Update to the Update ***

 

Fixed it with a little conditional CSS ...

@[member=media] (min-width: 970px) {
  #bodyWrapper {
    overflow-y: hidden;
  }
}

B)

 

Malcolm

Edited by ArtcoInc

If you are running the "official" osC 2.3.4 or 2.3.4.1 download, your installation is obsolete! Get the latest community-supported responsive "Edge" release here

Share this post


Link to post
Share on other sites

@@Tsimi,

 

I found a fault. when you look at your website in SM mode, you click on a picture to enlarge. The category is then through your photo​.

I think that was not the intention???

Share this post


Link to post
Share on other sites

also I discovered another one, when you view from md to sm mode, the text and the buttons are under the border (see picture beneath).

 

 

post-336856-0-68135300-1445771880_thumb.jpg

Share this post


Link to post
Share on other sites

the problem from the categorie in the image is in

templates/catmenu_xs.php

<div id="dl-menu" class="dl-menuwrapper visible-sm visible-xs" style="z-index:10000;">

when you put the z-index out, the categorie is gone when you enlarge an image.

<div id="dl-menu" class="dl-menuwrapper visible-sm visible-xs">

Share this post


Link to post
Share on other sites

update:

 

the text and the buttons under the border has nothing to do with this module. ( so you can forget the second one). :blush:      ​

 

it was because of my images. these are too big.

Share this post


Link to post
Share on other sites

@@dinopacha

 

Working during weekend? :D 

I don't :P

 

I see you solved already your problems.

Yeah, I added z-index so that the menu won't hide behind the boxes or products. 10000 was probably a bit extreme 10 or 100 would have done the job just fine.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×