Public Forums 71,145 posts

[jakeyboy89 Friend jakeyboy89Join date: April 2011Posts: 6Downloads:0Uploads:0]

#162456

Hi,

I finally got my site working, only to find that the mega menu slides behind my image scroller.

Is there anyway to ensure that the menu stays ontop?

My page is here – progressive talks.

Thanks,

Jake

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385236

It seem to appear fine right now for dropline menu type as seen presently. If the issue is appearing for mega menu, Please change menu type to specified to debug further

[jakeyboy89 Friend jakeyboy89Join date: April 2011Posts: 6Downloads:0Uploads:0]

#385238

I’ve just put that menu on there so the site is still functional,

but if you go to the menu “World News and Issues”

Then hover over any of the links ie. Australia, Europe etc..

You will see the third level drop down, you can only see climate change, but there are three other headings below this that are hidden behind the slideshow…

The same for megamenu or any other the other styles, when they drop, as soon as they cross the slideshow, they end up buried beneath the images.

Appreciate the assistance.. I’m at a bit of a loss as to what I should do…

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385239

Change this::

#slider {joloslider.css (line 25)
background: url(“loading.gif”) no-repeat scroll 50% 50% transparent;
min-height: 220px;
}

to

#slider {joloslider.css (line 25)
background: url(“loading.gif”) no-repeat scroll 50% 50% transparent;
min-height: 220px;
z-index: 1;
}

Css file reference:: modules/mod_joloslider/assets/joloslider.css

[jakeyboy89 Friend jakeyboy89Join date: April 2011Posts: 6Downloads:0Uploads:0]

#385246

Hi mate,

I made the change.. That seemed to make sense, but still hasn’t change anything.

I’ve pasted the entire css code below incase it helps.. I noticed though that I’ve changed the position to centre in the css file, yet the slideshow isn’t centred… maybe this is related also..

[PHP]/* The Nivo Slider styles */
#slider{
position: center;
min-height: 220px;
background: url(loading.gif) no-repeat 50% 50%;
z-index: 1;
}
#slider img{display: none;}
.nivoSlider {
position:center;
}
.nivoSlider img {
position:center;
top:0px;
left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
position:center;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:60;
display:none;
}
/* The slices in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:50;
height:100%;
}
/* Caption styles */
.nivo-caption {
position:absolute;
left:0px;
color:#fff;
opacity:0.8; /* Overridden by captionOpacity setting */
z-index:89;
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-caption a {
display:inline !important;
}
.nivo-html-caption {
display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav{

}
.nivo-directionNav a {
display:block;
width:30px;
height:34px;
background:url(arrows.png) no-repeat 0 0;
text-indent:-9999px;
border:0;
cursor: pointer;
top: 50%;
position: absolute;
z-index: 99;
}
.nivo-prevNav {
left :15px;
}
.nivo-nextNav {
background-position:-30px 0 !important;
right :15px;
}
/* Control nav styles (e.g. 1,2,3…) */

.nivo-controlNav {
position:absolute;
z-index: 1000;
cursor: pointer;
}
.nivo-controlNav img {
position:relative;
margin-right:10px;
display: inline-block !important;
}[/PHP]

Thanks again for the assistance I really appreciate it.

In the Template Manager it says Start Level: 0; End Level: -1

Is this correct?

I have put back the mega menu.

Cheers

[jakeyboy89 Friend jakeyboy89Join date: April 2011Posts: 6Downloads:0Uploads:0]

#385249

Apologies,

For some reason now it is working! That’s great.

As soon as I changed back to MegaMenu it started to work 🙂

You’re a champion!

Any ideas why it’s not centering??? Have I missed some editing in the css file?

Cheers

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385250

<blockquote>Any ideas why it’s not centering??? Have I missed some editing in the css file?</blockquote>

You can add these two properties also and update width value accordingly::

width:950px;
margin:0 auto;

[jakeyboy89 Friend jakeyboy89Join date: April 2011Posts: 6Downloads:0Uploads:0]

#385290

I added the following code to the same item that I changed the z-index on but the item is still not centering…

width:100%;
margin:0 auto;

Also, there are gaps above and below, is there a way to change the margins for layout positions user 1, 2, 3, 4, 5??

Thanks again

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385366

<blockquote>I added the following code to the same item that I changed the z-index on but the item is still not centering…

width:100%;
margin:0 auto;</blockquote>

Try to add in width in px value as suggested earlier

<blockquote>Also, there are gaps above and below, is there a way to change the margins for layout positions user 1, 2, 3, 4, 5??</blockquote>

I had added a reply for this in the appropriate thread::

http://www.joomlart.com/forums/topic/change-margins/

[Author]

Posts