public ITBrix.Core.Navigation

Contents [-]

General settings

Specific settings

Available webframe attributes

The webframe attributes are a tool for fine tuning some of the advanced capabilities of the webframe. They are to a large extend the same for each webframe type, but some of the webframes also have very specific attributes available. All webframe attributes are applied via the "General settings" tab of the webframe settings page.

In general, the attributes can be categorized on two large groups:

  • Functional attributes - they influence the business logic of the webframe. They are in most cases specific for the webframe type.
  • HTML attributes - using them, will result in altered generation of the HTML output of the webframe. They are in most cases general for all webframes and used for applying attributes to the HTML tags that the webframe renders

ITBrix.Core.Navigation functional attributes

attributevalueDescription
class:expanded
  • none (default)
  • current
  • all
 The system will automatically insert expanded class to the menu item "li" html tag. Used mostly for generating dynamic menus with javascript.
  • all - class "expanded" will be added to all menu items that has child items during the HTML render. 
  • current - class "expanded" will be added to all menu items that are parents of the current item. class "collapsed" will be added to all menu items that are not current item parents but have child items.
Example: <li class="expanded">
class:order
  • none (default)
  • first-last
  • odd-even
  • all
 The system will automatically insert classes to the menu item "li" html tag. The inserted classes are as follows:
  • first - the menu item is the first one in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "first-last" or "all".
  • last - the menu item is the last one in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "first-last" or "all".
  • odd - the menu item is with odd row in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "odd-even" or "all".
  • even - the menu item is with even row in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "odd-even" or "all".
Example: <li class="first odd">

ITBrix.Core.Navigation HTML attributes

Attributes applied to the webframe's "DIV" tag

These attributes are described in the General webframe attributes page.

Attributes applied to the webframe's menu "UL" tag

IMPORTANT: The attribute is applied automatically by the system and cannot be customized.

attributevalueDescription
class
  • level-1
  • level-2
  • level-3
  • ...
  • level-N
 The system will automatically apply class to the tag based on the level of nesting that this UL has in the current menu rendering.
Example: <ul class="level-1">

Menu item or URL node attributes that influence the menu presentation

These attributes are set from the menu item attributes or the URL node attributes. They are identical for the both cases and are applied under the following conditions:

  • URL node attributes are applied when the auto generated "URL map mirror" is used.
  • Menu item attributes are applied when manually created menus are used. In this case the URL node attributes are not applied.

Functional attributes

attributevalueDescription
display
  • none
 When this attribute is set, the corresponding menu item will not be rendered at all, no matter what are the specific navigation webframe settings.
child:span
  • false (default)
  • true
 When this attribute is set to "true", the corresponding menu item will be rendered with "span" html tag instead of "a", no matter what are the specific navigation webframe settings.
force:invisible comma separated roles list The menu item will not be visible or with class restricted (based on the setting of the navigation webframe) for all users that have the listed roles assigned. Applied before checking the "force:visible" attribute. Example: If a user has role that prohibits him of seeing the menu item, it will be applied, no matter that he may have roles that are allowing him to see it.
force:visible comma separated roles list The menu item will be visible only for users that have the listed roles assigned. Applied after the "force:invisible" attribute. Example: If a user has role that prohibits him of seeing the menu item, it will be applied, no matter that he may have roles that are allowing him to see it.

Attributes applied to the webframe's menu "LI" tag

attributevalueDescription
id free input The "id" attribute assigns an unique identifier to the element. This identifier should be unique for the page and can be used to refer to that element.
Example: <li id="para-1">
class free input The "class" attribute assigns a class name (or a list of class names separated by spaces) to the element. It's used with style sheets and tells the browser the class to which the element is associated with.
The system will automatically add classes as follows:
  • current - the menu item that according to the navigation webframe business logic is the current one (not always the menu item that is bound to the current URL node)
  • collapsed - the menu item has child items during the HTML render. Inserted based on the "class-expanded" attribute of the general webframe settings.
  • expanded - the menu item has heir, that is current during the HTML render. Inserted based on the "class-expanded" attribute of the general webframe settings and when it has value "current".
  • first - the menu item is the first one in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "first-last" or "all".
  • last - the menu item is the last one in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "first-last" or "all".
  • odd - the menu item is with odd row in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "odd-even" or "all".
  • even - the menu item is with even row in the primary or a nested menu branch siblings. Inserted based on the "class-order" attribute of the general webframe settings and when it has value "odd-even" or "all".
  • restricted - the menu item is bound to a node that is not accessible for the current user, due to node's or its bound page's restriction policy. This menu item will appear if the corresponding setting in the webframe's "Specific settings" is checked.
Example: <li class="first-child odd-child restricted">
style free input Defines a visual style of this element according to the CSS standards.
Example: <li style="color:#333333; border: none;">
title free input Gives a short description about the element shown as a "tool tip" when the user points the mouse over the element.
Example: <li title="this is a description">
lang HTML lang codes Specifies the language of the element's content.
Example: <li lang="en">
dir
  • RTL
  • LTR
 The text direction of the element's contents - "right to left (RTL)" or "left to right (LTR)"
Example: <li dir="LTR">
type
  • disc
  • circle
  • square
 Specifies the horizontal alignment of its element.
Example: <li type="disc">
onclick script Script to run when the element is clicked on
Example: <li onclick="my_script()">
ondblclick script Script to run when the element is double clicked on
Example: <li ondblclick="my_script()">
onmousedown script Script to run when a mouse button is pressed over the element
Example: <li onmousedown="my_script()">
onmouseup script Script to run when a mouse button is released over the element
Example: <li onmouseup="my_script()">
onmouseover script Script to run when the mouse pointer is over the element
Example: <li onmouseover="my_script()">
onmousemove script Script to run when a mouse pointer moves over the element
Example: <li onmousemove="my_script()">
onmouseout script Script to run when a mouse pointer moves out of the element
Example: <li onmouseout="my_script()">
onkeypress script Script to run when a keyboard button is pressed and released over the element
Example: <li onkeypress="my_script()">
onkeydown script Script to run when a keyboard button is only pressed over the element
Example: <li onkeydown="my_script()">
onkeyup script Script to run when a keyboard button is only released over the element
Example: <li onkeyup="my_script()">

Attributes applied to the webframe's menu item "a" tag

A menu item is rendered as a link in the general case. It is rendered as "span" in two cases:

  • a specific menu item (url node) attribute is forcing it
  • it is a "current" menu item and the corresponding webframe "Specific setting" is checked.

 

attributevalueDescription
child:id free input The "id" attribute assigns an unique identifier to the element. This identifier should be unique for the page and can be used to refer to that element.
Example: <a id="para-1">
child:class free input The "class" attribute assigns a class name (or a list of class names separated by spaces) to the element. It's used with style sheets and tells the browser the class to which the element is associated with.
Example: <a class="home">
child:style free input Defines a visual style of this element according to the CSS standards.
Example: <a style="color:#333333; border: none;">
child:title free input Gives a short description about the element shown as a "tool tip" when the user points the mouse over the element.
Example: <a title="this is a description">
child:charset character encoding Specifies the character encoding of the target URL content
Example: <a charset="utf-8">
child:href locked The system will automatically apply href attribute to the link
child:hreflang HTML lang codes Specifies the language of the target URL content.
Example: <a hreflang="en">
child:type content-type Tells the browser the content type of the resource named in "href" attribute.
Example: <a href="logo.png" type="image/gif">
child:rel
  • nofollow
  • alternate
  • stylesheet
  • start
  • next
  • prev
  • contents
  • index
  • glossary
  • copyright
  • chapter
  • section
  • subsection
  • appendix
  • help
  • bookmark
 Describes the relationship between the current document and the destination resource.
Example: <a rel="copyright">
child:rev
  • alternate
  • stylesheet
  • start
  • next
  • prev
  • contents
  • index
  • glossary
  • copyright
  • chapter
  • section
  • subsection
  • appendix
  • help
  • bookmark
 Describes the relationship between the destination resource and the current document (the opposite of "rel").
Example: <a rev="index">
child:shape
  • default
  • rect
  • circle
  • poly
 The shape attribute is used together with the "coords" attribute to specify the size, shape, and placement of a link in an object or img element.
Example: <a href="mercur.htm"shape="circle" coords="90,58,3">
child:coords
  • rect: left-x, top-y, right-x, bottom-y.
  • circle: center-x, center-y, radius.
  • poly: x1, y1, x2, y2, ..., xN, yN.
 The coords attribute is used together with the shape attribute to specify the size, shape, and placement of a link in an object or img element.
Example: <a href="mercur.htm"shape="circle" coords="90,58,3">
child:target
  • _blank
  • _self
  • _parent
  • _top
  • framename
 The target attribute specifies where to open the linked document.
Example: <a target="_blank">
child:tabindex integer The position of this element in the tabbing order.
Example: <a tabindex="3">
child:accesskey character Specifies a keyboard shortcut to access an element (usually when used together with the "alt" key).
Example: <a accesskey="a">
child:name free input Defines a unique name for the element.
Example: <a name="menu">
child:onfocus script Script to run when the element gets focus
Example: <a onfocus="my_script()">
child:onblur script Script to run when the element loses focus
Example: <a onblur="my_script()">
child:onclick script Script to run when the element is clicked on
Example: <a onclick="my_script()">
child:ondblclick script Script to run when the element is double clicked on
Example: <a ondblclick="my_script()">
child:onmousedown script Script to run when a mouse button is pressed over the element
Example: <a onmousedown="my_script()">
child:onmouseup script Script to run when a mouse button is released over the element
Example: <a onmouseup="my_script()">
child:onmouseover script Script to run when the mouse pointer is over the element
Example: <a onmouseover="my_script()">
child:onmousemove script Script to run when a mouse pointer moves over the element
Example: <a onmousemove="my_script()">
child:onmouseout script Script to run when a mouse pointer moves out of the element
Example: <a onmouseout="my_script()">
child:onkeypress script Script to run when a keyboard button is pressed and released over the element
Example: <a onkeypress="my_script()">
child:onkeydown script Script to run when a keyboard button is only pressed over the element
Example: <a onkeydown="my_script()">
child:onkeyup script Script to run when a keyboard button is only released over the element
Example: <a onkeyup="my_script()">

Attributes applied to the webframe's menu item "span" tag

A menu item is rendered as a link in the general case. It is rendered as "span" in two cases:

  • a specific menu item (url node) attribute is forcing it
  • it is a "current" menu item and the corresponding webframe "Specific setting" is checked.

 

attributevalueDescription
child:id free input The "id" attribute assigns an unique identifier to the element. This identifier should be unique for the page and can be used to refer to that element.
Example: <span id="para-1">
child:class free input The "class" attribute assigns a class name (or a list of class names separated by spaces) to the element. It's used with style sheets and tells the browser the class to which the element is associated with.
Example: <span class="home">
child:style free input Defines a visual style of this element according to the CSS standards.
Example: <span style="color:#333333; border: none;">
child:title free input Gives a short description about the element shown as a "tool tip" when the user points the mouse over the element.
Example: <span title="this is a description">
child:lang HTML lang codes Specifies the language of the element's content.
Example: <span lang="en">
child:dir
  • RTL
  • LTR
 The text direction of the element's contents - "right to left (RTL)" or "left to right (LTR)"
Example: <div dir="LTR">
child:align
  • left
  • center
  • right
  • justify
 Specifies the horizontal alignment of its element.
Example: <div align="left">
child:onclick script Script to run when the element is clicked on
Example: <a onclick="my_script()">
child:ondblclick script Script to run when the element is double clicked on
Example: <a ondblclick="my_script()">
child:onmousedown script Script to run when a mouse button is pressed over the element
Example: <a onmousedown="my_script()">
child:onmouseup script Script to run when a mouse button is released over the element
Example: <a onmouseup="my_script()">
child:onmouseover script Script to run when the mouse pointer is over the element
Example: <a onmouseover="my_script()">
child:onmousemove script Script to run when a mouse pointer moves over the element
Example: <a onmousemove="my_script()">
child:onmouseout script Script to run when a mouse pointer moves out of the element
Example: <a onmouseout="my_script()">
child:onkeypress script Script to run when a keyboard button is pressed and released over the element
Example: <a onkeypress="my_script()">
child:onkeydown script Script to run when a keyboard button is only pressed over the element
Example: <a onkeydown="my_script()">
child:onkeyup script Script to run when a keyboard button is only released over the element
Example: <a onkeyup="my_script()">
Last edited by Boz Zashev on 30 Sep 2010 | Rev. 6 | This page is public | Views: 1
Comments: 0 | Filed under: Web page components | Tags: