Javascript 将phpFox功能导入SocialEngine

phpFox发布了一个名为“星云”的主题，版本为3.5.0。在这个主题中，标题上有一个按钮，当用户单击按钮时，菜单向下滑动。（实际上不是一个按钮，而是一个div）

我想将此功能添加到SocialEngine。但是JavaScript代码包含一个phpFox变量，我不知道它指的是什么。我不太擅长JavaScript

HTML:

CSS:

---

我应该怎么做才能使这段代码与SocialEngine一起工作？

那么$Behavior命名空间是onLoad事件的包装器，这就是您所说的js变量吗？如果是，您可以用更传统的jquery/mootools/etc方法替换它，虽然您必须正确匹配选择器，但它可能会工作，不知道您发布的代码是否是您所需要的全部

这是在phpFox上工作的代码。我只需要知道应该做些什么更改才能使这段代码在SocialEngine上工作。当我将其作为一个小部件应用时，我在Chrome Debug上遇到以下错误：UncaughtReferenceError:$Behavior未定义是的，这就是我所说的，尝试用普通文档替换$Behavior。ready handler，我不知道社交引擎是否使用JQuery，但如果它这样做，应该会有所帮助

<div id="nb_features">
  <a href="#" id="nb_features_link">Features</a>
  <div id="nb_features_holder">
    Menu widget code will be added here...
  </div>                                
</div>

$Behavior.customNebula = function(){

    $('#nb_features_link').click(function(){

        if ($(this).hasClass('nb_is_clicked')) {
            $(this).removeClass('nb_is_clicked');
            $('#nb_features_holder').slideUp('fast');
        } else {
            $(this).addClass('nb_is_clicked');
            $('#nb_features_holder').slideDown('fast');
        }

        return false;
    });
};

#nb_features {
    position:absolute;
    top:0px;
    right:0px;
}

#nb_features_link,
#nb_features_link:hover {
    display:block;
    width:40px;
    height:40px;
    line-height:40px;   
    text-indent:-1000px;
    overflow:hidden;
    background:url(~/application/modules/Wonder/externals/images/nb_features_link.png') no-repeat;
    margin-top:-7px;
    margin-right:20px;
}

#nb_features_link:hover {
    background:#334d83 url(~/application/modules/Wonder/externals/images/nb_features_link.png') no-repeat;
}

#nb_features a.nb_is_clicked,
#nb_features a.nb_is_clicked:hover {
    background:#334d83 url(~/application/modules/Wonder/externals/images/nb_features_link.png') no-repeat;
}

#nb_features_holder {
    position:absolute;
    background:#4f4f4f;
    right:0px;
    width:980px;    
    border:1px #304779 solid;
    border-top:0px;
    display:none;
    margin-top:20px;
}

#nb_features_holder ul li a,
#nb_features_holder ul li a:hover {
    float:left;
    color:#fff;
    height:30px;
    line-height:30px;
    padding:0px 10px 0px 10px;
    text-decoration:none;
}

#nb_features_holder ul li a.menu_is_selected,
#nb_features_holder ul li a.menu_is_selected:hover {
    background:#009AEF;
    color:#fff;
}

#nb_features_holder ul li a:hover {
    background:#2F2F2F;
    -webkit-transition: all 0.50s ease;
    -moz-transition: all 0.50s ease;
    -o-transition: all 0.50s ease;      
}