Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
  • #8502

    Hello, I am currently customizing the look of the template

    I wanted to do a couple of things,

    1. I have moved the child links to appear underneath the parent link. I want to make a hover over effect similar to superfish ie when you hover over the parent link to view the child links, the other links below will be pushed down the page to make room for the child links to appear.

    If you look at My Site I have large space where the child links appear (hover over BEACH or CITY), I cannot figure out how to remove the large spaces.

    2. I wanted to add a transparency and blur to the background of the navigation menu. Does anyone know how to do this?

    3. I want to use Josefin custom font, but it isn’t appearing very clear, does anyone know why?

    4.Lastly, the custom font is not being applied to the child links in the navigation

    Many thanks


    I’ve made a few changes since posting. I’ve added a image for the background transparency, but I still looking for a way to blur any content underneath this.

    I’ve changed font to Oswald, is there any way to have hoverover effects on custom fonts??



    Sorry another question.

    How can I get the child links in the navigation to stay on screen if user is currently viewing a child page?




    it’s not easily possible to add a blur effect to the background because this requires calculations. There’re some js scripts out there which use canvas but I can’t give you instructions how to implement them (because I’ve never done it and I’d need to do some research myself):

    2) I’ve reported this question to Kriesi. It seems to be a Cufon issue. Basically Cufon should support hover effects (and Kriesi activated the feature in this theme) but it doesn’t work correct. Another users reported the bug too and I’m waiting for Kriesi’s answer.

    3) You can use following css code:

    #top .main_menu .menu .current-menu-item sub-menu{
    display: block !important;
    visibility: visible !important;


    Hi, thanks for the reply I wait to hear what Kriesi says, in the mean time I’ll just disable it.

    I tried the css code, the gap has gone but I child links are overlapping the parent links. I’ve tried setting the z-index both to 5 but this hasn’t had an effect


    I’ve just found using firebug if I go to the element style for the sub-menu ul and disable display:block and add position:relative it works.

    However I don’t know where in the css it is getting the display:block from so I cannot edit it out.


    Could you tell me which php file contains the code for the navigation menus please



    1) The display:block attribute is added by the javascript. In js/avia.js you’ll find following line:

    sublist.css({display:'block', opacity:0, visibility:'hidden'});

    which triggers this output.

    2) The nav menu code can be found in js/avia.js and flashlightincludesadminregister-menu-walker.php


    thank you, that worked

    IE7 and IE8 are behaving oddly, if you try to scroll over the child links the drop down closes, do you mind having a look.

    Seems that the slide show is causing some conflict but navigation works perfectly in IE8 if there is no slideshow. However IE7 does something very strange, it looks like the navigation has disappeared but there is a small vertical scroll bar on the right hand side of the page.




    Please help asap :(


    Hi Larssonk22

    The default sub-menu in Flashlight sucks, and just like you, I would prefer it was positioned underneath the parent links.

    Would you mind sharing how you created your submenu?

    Best, Martin


    Hi Martin, the technical support here is poor as well unfortunately, I’m going to have huge delays launching this site because it takes so long to get a response if at all :(

    You can edit the main style.css/minimal-skin.css or add overriding styles in the custom style section. I’ve tried to use the custom style sheet as much as possible to make upgrades easier.

    First of all I removed the position absolute and left positioning from the parent link i.e.

    #top .main_menu .menu ul {position:relative !important; left:0px !important;}

    Next removed the padding from #top .main_menu .menu li li {padding: 0 0 !important;}

    Then I had to remove the border-bottom from #top .main_menu .menu ul li a {border-bottom:0px !important;}

    You may want to keep the border but remove the border from the ul, so you could use this instead

    #top .main_menu .menu ul {border:0px !important;width:200px !important;}

    After that’s done you need to add a position to the child link ul container i.e

    #top .main_menu .menu ul {position:relative !important}

    Then as Dude mentioned, find the ‘avia.js’ file in the js folder, removed the display:block from the line

    sublist.css({display:’block’, opacity:0, visibility:’hidden’});

    mine looks like this now

    sublist.css({opacity:0, visibility:’hidden’});

    Think that’s it, hope that helps




    concerning your IE7 issue you should have a look at this.

    I’d also like to add we try to answer the support questions within 24 hours, however it is my fault quite some topics have gone unanswered recently because I couldn’t fill in my shifts.

    Your request is a customisation of the theme, which isn’t within the direct scope of the support forum – and it has been passed as a feature request.

    For further requests you can paste code between backticks as suggested below the “Send Post” button, this way we can have a clear look at the code you’re pasting.

    Let us know if there’s anything else.


    Hi Chris, ok thanks. Do you have any idea what is stopping me from being able to scroll over the child links in IE8?


    Thank you so much! I will try it out and let you know..


    I’ve given up on this so I’ve decide to completely redo the navigation menu using superfish

    Could one of the admins please confirm where the container is for the navigation menu

    I went to “flashlightincludesadminregister-menu-walker.php” but there is no sign of “.main_menu main_menu_menu_manager” or “#menu-navigation”


    NM, thought I had checked sidebar.php but I guess I hadn’t. Found it


    ok I figured out that the IE7 bug was caused by having no height defined so I added the following to the css style sheet

    html,body {height:100%;}

Viewing 16 posts - 1 through 16 (of 16 total)

The topic ‘Customizing Navigation Menu / Background / Expanding Drop Down’ is closed to new replies.