DD mega menu positioning

[pase]

1) Script Title:
DD Mega Menu

2) Script URL (on DD):http://www.dynamicdrive.com/dynamici...ddmegamenu.htm

3) Describe problem:
I am trying to figure out the positioning for the individual drop down boxes. Can the drop down menu boxes be positioned individually left, right, center and random points?
thanks

[ddadmin]

Each drop down box can be individually placed to the left or right of the anchor link (but beyond that not arbitrarily). To do this, you'd just make use of the syntax highlighted below in the markup for your anchors:

<ul id="solidmenu" class="solidblockmenu">
<li><a href="http://www.dynamicdrive.com/">Home</a></li>
<li><a href="http://www.javascriptkit.com" rel="jkmenu">JavaScript v</a></li>
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li>
<li><a href="http://tools.dynamicdrive.com">Webmaster Tools</a></li>
<li><a href="http://www.cssdrive.com" rel="cssdrivemenu[left]">CSS Drive v</a></li>
</ul>

The "left" suffix here will cause the associated drop down menu to drop down to the left of the anchor link in question.

[pase]

thanks, I am able to place the box on the left or right of the anchor point. Is it possible to move the anchor points to achieve a custom box placement?

[djr33]

Each drop down box can be individually placed to the left or right of the anchor link (but beyond that not arbitrarily).

Custom placements won't be possible without modifying the code. It could be possible to use something like (just an example) custom=50 like the "left" tag. This would (in theory) offset it 50 pixels. But you would need to modify the script itself to interpret "custom" like it interprets "left" and then add a way to interpret the "50" as well. Is this required? You might want to post this in the DD scripts paid work requests forum, near the bottom of the main forum page.



EDIT: If you do want to attempt to modify the script to handle this, you would need to modify two lines (probably duplicating them to handle the additional "custom" option):
You would need to check for the "custom" option in addition to left here:

var orienttoleft=/\[left\]/.test($anchor.attr('rel')) //check for rel="submenuid[left]" to indicate submenu should be left aligned

This line handles the actual positioning. You'd need to add a third condition (custom) and account for it here:

$wrapper.css({visibility:'visible', left:offset.left-(orienttoleft? $wrapper.outerWidth()-$anchor.outerWidth()-ddmegamenu.wrapperoffset[0] : 0), top:offset.top+$anchor.outerHeight(), zIndex:++ddmegamenu.startzindex})

Note that you would need to determine the pixel value (eg 50) and store that, probably when reading the 'custom' tag initially. Then you'd use that to modify the CSS properties.

By the way, I'd recommend two options: positive numbers (like 50) are offset from the right, and negative numbers (like -50) are offset from the left. That would give maximum freedom.
(Of course once that was in place you would no longer need the "left" (or even default) positioning-- you could just use 0 and -0 if you want.)

[pase]

I would like to attempt to modify the script. I found the 2 js code lines, duplicated them and changed the "left" position to "custom". I also changed the anchor tag [left] to [custom=50] in the html page. Can you advise where to store the value "50" in the js and css. thanks!

[djr33]

If you don't have experience editing Javascript, then you may need someone to hire to make this modification for you. It will be a substantial change in the script (though not too difficult for an experienced Javascript coder). I explained the methods above, and I don't have time at the moment to actually do all of the changes required. Note that you will not need to modify the CSS, but just the Javascript because you can (dynamically) change CSS style values through Javascript.