Submenu symbol missing?

Home Forums Older releases 0.9.x Submenu symbol missing?

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #1279
    jsibley
    Participant

    First, by default is there supposed to be a symbol indicating that there are sub-menu items in sm-clean? I am not seeing any symbol, although I do see a span with a class of “more-indicator”?

    Second, if I want to or need to specify the symbol to show, could you please share the syntax for specifying the value? It looks like I might need to specify subIndicatorsText, but I don’t see an example of how I might do that (or any other of the parameters you have included in the documentation.

    Thanks for a plugin that still works with jquery 1.4, for those using installations of Drupal 7 that can’t upgrade yet!

    #1480
    admin
    Keymaster

    Hi, yes, you can see on the default example that the “sm-clean” class shows sub indicators:

    http://vadikom.github.io/smartmenus/src/demo/

    Though the class that the script sets to the spans is “sub-arrow” which makes me think you might possibly also use some other script that adds those “more-indicator” spans you mention (or they are directly outputted in the source).

    The sub indicators are generally controlled by the “subIndicators”, “subIndicatorsPos” and “subIndicatorsText” options. By default “subIndicatorsText” is set to “+” which means you would get the following:

    <a href="#"><span class="sub-arrow">+</span>Item text</a>

    And then in the theme we have the following CSS:

    .sm-clean a span.sub-arrow {
    	position:absolute;
    	right:12px;
    	top:50%;
    	margin-top:-3px;
    	/* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
    	width:0;
    	height:0;
    	overflow:hidden;
    	border-width:4px; /* tweak size of the arrow */
    	border-style:solid dashed dashed dashed;
    	border-color:#555 transparent transparent transparent;
    }
    /* and few more rules for sub levels and mobile... */
    

    The following declarations:

    	width:0;
    	height:0;
    	overflow:hidden;
    	border-width:4px; /* tweak size of the arrow */
    	border-style:solid dashed dashed dashed;
    	border-color:#555 transparent transparent transparent;

    basically make sure the “+” is hidden and we then apply some border to create the triangle instead. If you would like to show the “+” or some other symbol instead of the default arrow, just remove the above declarations and it should appear.

    I hope this helps, please let me know if you still have any troubles. In that case, it would help very much if you could post some live demo I could test.

    Cheers!

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.

Register

You will be emailed a link to set your password.

Login

Lost password?