Problems with navigation bar

Hi,

I have few problems with the navigation bar one is that I have modified the CSS so that the menu bar is not fully transparent I've set opacity of 0,6 to the menu bar now when i scroll the site down so that the menu changes to white it works ok but when i scroll back up the menu bar is not the with of the page any more see picture attached some how it seems that when the scrollbar moves it skips out of the clean div.

i've tried to modify the gk.scripts.js

and i know that thease are the line affecting this problem but i could figure it out

// menu animation


if(page_loaded && jQuery('body').hasClass('imageBg')) {
// if menu is not displayed now
if(jQuery(window).scrollTop() > headerHeight && !jQuery('#gkMenuWrap').hasClass('active')) {
//document.id('gkHeaderNav').inject(document.id('gkMenuWrap'), 'inside');
jQuery('#gkMenuWrap').append(jQuery('#gkHeaderNav'));
jQuery('#gkHeader').attr('class', 'gkNoMenu');
// hide
jQuery('#gkMenuWrap').attr('class', 'active');
}
//
if(jQuery(window).scrollTop() <= headerHeight && jQuery('#gkMenuWrap').hasClass('active')) {
jQuery('#gkHeader').first('div').css('display', 'block');
// it seems there should be opening <div> here
jQuery('#gkHeader').first('div').prepend(jQuery('#gkHeaderNav'));
jQuery('#gkHeader').attr('class', '');
jQuery('#gkMenuWrap').attr('class', '');
// and a closing </div> here

}
}

another problem is that the opacity setting seems to work only in chrome and firefox.

The development site is accessible from the internet please pm me to get the address.

Hi

Please send me joomla panel access to my PM.

teitbite any news? did you get my pm?

Hi

No. I do not see any message from You in my PM. Please send it one more time.

Did you recive it?

Hi

Yes, now I got 2

But please tell me which page is this problem visible ? I'm scrilling up and down on different pages but it's still ok:

What browser you are using i just realized i've been using chrome witch shows the page up "correctly" but ie and firefox does not even show the half transparent bar on the menu bar. and the css structure seems to be different in chrome vs fox or ie

and the front page

with fox and ie the menu.css line 239-242 does not seem to have any kind of effect

.imageBg #gkHeader > div:first-child {
/* background: transparent; */
background: rgba(255, 255, 255, 0.75);
}

Hi

Ok I was able to notice the difference while looking at html change and I remember reporting this problem to programmers already. This issue is not present in demo, so It's clear problem is fixed. Please simply update Your template to the latest version. I believe the fix was in /js/gk.script.js file.

I updated the new version of the theme still the problem exists if i set the menu background color white and opacity 0.75 only chrome shows it and the menu breaks after scrolling down and back up to the start with the header picture. firefox and ie does not show the change in the menu background color at all. so it seems that the problem has not been fixed. some modification to this problem has been worked on the wordpress version in the forums. one nice feature would be that you can manage the menu background and font color in the management. and the header pictures also.

Hi

Please send me an access to ftp. I need to compare the code with my copy. Menu is placed correctly in an installation I have on my computer and it shows correctly in all browsers.

Hi

I've reported this to programmers. Will let You know when they will answer.

Hi

Please edit file: gk_simplicity/js/gk.scripts.js and replace lines 153 and 154 which looks like this:

Code: Select all

jQuery('#gkHeader').first('div').css('display', 'block');
jQuery('#gkHeader').first('div').prepend(jQuery('#gkHeaderNav'));


to

Code: Select all

jQuery('#gkHeader > div').first().css('display', 'block');
jQuery('#gkHeader > div').first().prepend(jQuery('#gkHeaderNav'));


OK now it works Correctly with Chrome but not in FireFox (FF) or Internet Explorer (IE). is there other style sheets that i need to change for FF and IE to have the same effect to work in those browsers?

Hi our own programmer came to work and he found the reson for ie and ff not working

in menu.css he add to the rule witch starts on line 238
min-height: 70px

and now it works for some reason FF and IE does not inherit that information same way as chrome does from the parent

Hi

Och, You meant the background now ? Yes I have came to the same solution, was just focused on the html structure problem and forgot about this completly. Sorry for that.

No problem main thing is that the site layout works now as it should. Thank you so much for your help!

Hi

Ok. Great to hear that. Glad I could help.