by (470 points)
I'm using the toasty trucks theme as a basis for a site template, but I'd like to control the behaviour of the menu on page load. For example, when each page loads, the menu appears and is open, but as yet I've not found where this behaviour is instigated from.

Ideally I'd like the menu to go from open to closed upon page load, in a couple of seconds. I'm assuming it's a JS control somewhere?

Many thanks!

1 Answer

by (4.1k points)
selected by
 
Best answer
Hello strebblo.

We are preparing new version of this theme now. And fix for the menu will be applied to it. We will inform you when this theme will be updated.
Then you can download and use this theme.

Thank you.
by (470 points)
Great! Would you also be able to publish the fix for the menu alone please?
After heavily modifying this theme, I don't want to have to start again from scratch.

Thanks
by (4.1k points)
for html changes

<!-- Main Menu -->
<div class="gray">
    <div class="container_16">
        <nav id="main-menu" class="grid_16">{$menu:main}</nav>
    </div>
    <span class="clear"></span>
</div>

For CSS ---> nav

ul.main_menu ul{
    position:absolute;
    background-color:#6183AC;
    display:none;
}
ul.main_menu li.page a{
    font-size: 16px;
    padding: 15px 30px;
    }

For CSS ---> content

.gray .container_16{
    overflow:visible;
}
by (470 points)
Thanks Andrey,

I'll give this a try later.
by (470 points)
Thanks andrey, I've had this working in the main content box and it's great, but I have now moved the menu into the #top div instead, and it doesn't drop down - do you have any suggestions please?

Is it something to do with positioning?

Thanks!
by (470 points)
Hi Andrey, did you have any ideas about the menu no not dropping down?

Many thanks again..
by (4.1k points)
Hello Strebblo.
If you move main-menu in #top div. Try to use.

 .wrap {
float: left;
width: 100%;
}
#top.container_16{
    overflow:visible;
}

Thank you.
by (470 points)
Thanks Andrey - I've just trying to find these, which style sheet are they in please?
by (4.1k points)
Yes you can put  it in any css file. For example in content.css.
by (470 points)
I found:

/********************** BASIC STYLE **********************/
.wrap { overflow: hidden; } <---- (on Line 395)

in reset.css - surely this is relied upon by other elements, so if I change this global class other stuff will break?
by (4.1k points)
Can you give us link to your website?
by (470 points)
No problem - I'll PM you with it... :)
by (470 points)
Any luck? I'm not certain the PM went!
by (4.1k points)
Hello Strebblo.

Try to insert in  content.css from line 127

.gray3{
overflow: visible;
float: left;
width: 100%;
}
------
#top{
overflow: visible;
clear: both;
}
#nav.css
ul.main_menu ul {
background-color: #693588;
}
ul.main_menu li.page a {
font-size: 14px;
padding: 10px 30px;
}
 ul.main_menu li.category a:hover{
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
by (470 points)
Fantastic - Thank you very much Andrey, I'll put that in later today when I'm back at my PC.
...