4

我是网络开发的新手…………

我使用Metro UI CSS来创建这个

我现在正在尝试模拟 Charms Bar。

我希望当用户单击主题按钮时,应在右侧显示一个包含一些控件等的栏。该栏应在失去焦点时隐藏(用户在栏外单击)。

Charms 栏是使用<div class="charms">我也添加style="display:none;"的,因此该栏在开始时不可见。

然后我使用以下代码在用户选择主题按钮或文本时显示它

$(document).click(function(event) 
{
var $target = $(event.target);
var target = event.target;

if (!target.id.indexOf("theme")) //if the target id contains "theme" then show charms bar
{
    $("div .charms").fadeIn(600)
}

else
{
    if (target.id != "charms")  //if the charms bar itseff is NOT clicked
        $("div .charms").fadeOut(600)
}   
});

我不喜欢这段代码,因为当我单击魅力栏中的控件时,它会隐藏栏本身。

我需要做的就是创建一个浮动栏,当用户单击按钮时可见,当用户单击其他内容时隐藏.......

4

1 回答 1

2

你正在考虑,像这样的东西:

Use Event Like mousemove : to populate Charms bar see below :

见演示

将鼠标移到窗口右侧。

于 2014-02-14T10:06:11.687 回答