如何在运行时从YUI菜单中删除阴影?

时间:2011-01-16 05:42:22

标签: yui yui-menu

我有一个菜单按钮,我想从中删除阴影。我想必须首先实例化一个菜单对象(因为它要求我在DOM中指定一个div来附加它)。我可以在JS中实例化一个菜单,但当我尝试通过:this.menuButton.getMenu().cfg.setProperty('shadow', false);删除投影时,仍然会出现投影。我检查了JS调试器中的cfg对象,阴影设置为false,但阴影仍然出现。

另一种选择是从dom中删除阴影div,但这似乎不是正确的做法。

1 个答案:

答案 0 :(得分:0)

我最终在我的DOM中创建了一个div来保存我的菜单。起初我很谨慎,因为我的布局不是非常强大(我们外包给了一个平面设计师并且一直试图将他的工作与我们的代码整合);这就是为什么我不想在DOM中引入div。

对我而言,关键是将div包含在不会影响布局的地方。最初我有一些看起来像这样的东西:

<input> type="button" id="srchType" />
<input type="text" id="first-name" value="First Name" />
<input type="submit" id="profiles-search-submit" value="Search" />

我在两个输入之间插入了div;这搞砸了我的布局。关键是在之前或之后插入div;这不会搞砸我的布局。 YMMV,取决于您的DOM对更改的敏感程度;如果他们想知道他们应该做什么,我希望这可以帮助别人。

执行此操作(创建div)后,您可以创建一个YUI Menu对象,如下所示:

var searchMenuItems = 
  [{ text: "First Name", value: 'firstName', onclick: {fn: onMenuItemClick}},
   { text: "Last Name", value: 'lastName', onclick: {fn: onMenuItemClick}}];

var srchTypeMenuConfig = { shadow: false,
                           effect: { 
                            effect: YAHOO.widget.ContainerEffect.FADE,
                            duration: .25 
                           }
                         };
this.srchTypeMenu = new YAHOO.widget.Menu(this.searchMenuEl, 
                                          srchTypeMenuConfig);