View Full Version : [ddsmoothmenu] Dynamically change the arrowimages ?

06-06-2014, 02:18 PM
1) Script Title:

2) Script URL (on DD):

3) Describe problem:
Hello !
I'd like to implement ddsmoothmenu for a website which will take care about "accessibility", essentially for partially sighted persons. Therefore, I need to offer the ability to dynamically change the stylesheet of my webpage, in order to display contrasted elements on demand (i.e. by clicking on a link). All is OK, but ...
...both arrowimages of ddsmoothmenu are part of the style elements I'd like to change on demand, but they are located in the ddsmoothmenu.js file and cannot be dynamically modified (they aren't included in the currently editable parameters like orientation, classname, arrowswap...).
Could you please tell me if it's possible, and how I can do that ???
Thank you very much !

06-07-2014, 02:09 AM
I don't really understand the question. You can configure which images are used for the arrows, as well as whether or not they will change on roll over/active, and if so, you can also configure which images will be used for the roll over/active. Line 49 in the ddsmoothmenu.js file (notice that you can configure the classes as well as the images and right padding used*):

arrowimages: {down:['downarrowclass', 'down.gif', 23], right:['rightarrowclass', 'right.gif', 6]},

allows you to configure the arrow images. If you set the arrowswap property to true in a particular init:

mainmenuid: "smoothmenu1", //menu DIV id
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu', //class added to menu's outer DIV
arrowswap: true,
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]

v2.0 option

Boolean that if set to true (defaults to false) will cause the script to show alternate versions of the arrow images (down and right) of the menu when the mouse rolls over a menu header. In other words, it enables rollover effect on the arrow images.
You do NOT specify the paths to the rollover images when this option is enabled. Instead, the script simply looks at the path and file names of the default arrow images inside ddsmoothmenu.js and appends a "_over" suffix to the default images' file names to form the full path and file names to the rollover images. So if the paths to the default arrow images as specified inside ddsmoothmenu.js are as follows:

arrowimages: {down:['downarrowclass', 'images/down.gif', 23], right:['rightarrowclass', 'images/right.gif', 6]},

In this case you should name your rollover images down_over.gif and right_over.gif respectively, and place them inside the images/ directory.

If you have a more specific question about this, or the below, feel free to ask. But please include a link to the page you are having trouble with so we can see what you are doing on it.

*Since the arrow images are background images. If you want to change them after initialization, you can append a stylesheet to the head of the page which redefines the background image(s) and/or other properties for that/those class(es), as well as (if desired) the image(s), etc. used for the hover pseudo class and the a .active classname values. Values used for these background-image properties may have to utilize the !important keyword in order to override the previously configured values.