var menuDelay=1000;
var menu,menuHeader,menuBody,menuItems=[],menuState=false;
function itemDropDown(item){//actions to dropdown
console.log("Dropping Down",item);///////////////////////////////////////////
item.style.display="block";//visible style
};
function itemRollUp(item){//actions to roll-up
console.log("Rolling Up:",item);///////////////////////////////////////////
item.style.display="none";//visible style
};
function itemHighlight(evt){
if(evt.target.className=="GMMenuItem")evt.target.className="GMMenuItemHighlited";
}
function itemUnhighlight(evt){
if(evt.target.className=="GMMenuItemHighlited")evt.target.className="GMMenuItem";
}
function GM_registerMenuCommand(caption,func){
if(!menu)makeMenu();
//return false;
var menuItem=document.createElement('div');
menuItem.className="GMMenuItem";
menuBody.appendChild(menuItem);
menuItem.addEventListener("click",func,false);
menuItem.innerHTML=caption;
menuItems.push(menuItem);
}
function GM_listValues(){
return false;
}
function rollUp(){
var i;
for(i in menuItems){
setTimeout(function(){itemRollUp(menuItems[i]);},menuDelay*i);
//i++;
}
setTimeout(function(){menuBody.style.display="none";},menuDelay*i);
menuState=false;
}
function dropDown(){
menuBody.style.display="block";
menuState=true;
var i;
for(i in menuItems){
setTimeout(function(){itemDropDown(menuItems[i]);},menuDelay*i);
//i++;
}
setTimeout(function(){menuBody.style.display="block";},menuDelay*i);
}
function menuView(){
if(menuState)
rollUp();
else
dropDown();
console.log("menuState:",menuState);//////////////////////////
}
function makeMenu(){
var menuCss=document.createElement('link');
menuCss.setAttribute('type', 'text/css');
menuCss.setAttribute('href', "http://gmapihtml5.googlecode.com/files/gmapi.css");
menuCss.setAttribute('rel', 'stylesheet');
document.getElementsByTagName('HEAD')[0].appendChild(menuCss);
//console.log("styleseet included");//////////////////////////
menu=document.createElement('div');
document.body.appendChild(menu);
//console.log("menu main div created");//////////////////////////
menu.className="GMMenu";
menuHeader=document.createElement('div');
menu.appendChild(menuHeader);
menuHeader.className="GMMenuHeader";
//menuHeader.innerHTML="";
//console.log("menu header created");//////////////////////////
menuBody=document.createElement('div');
menuBody.className="GMMenuBody";
menu.appendChild(menuBody);
menuBody.style.display="none";
//console.log("menu body created");//////////////////////////
menuHeader.addEventListener("click",menuView,false);
menuBody.addEventListener("mouseover",itemHighlight,false);
menuBody.addEventListener("mouseout",itemUnhighlight,false);
}
GM_registerMenuCommand("qwerty1",function(){alert(1)});
GM_registerMenuCommand("qwerty2",function(){alert(1)});
GM_registerMenuCommand("qwerty3",function(){alert(1)});
GM_registerMenuCommand("qwerty4",function(){alert(1)});
почему-то раскрывается не плавно, а так: убирается последний элемент (qwerty4), потом сворачивается меню резко
сообщения о появлении/скрытии в консоль файрбага пишутся по таймеру
а само появл.скрытие - не по таймеру
чтобы прочувствовать скопируйте код в консоль файрбага и выполните
потом кликните по обезьяней морде в верху экрана
желательно исполнять в другой вкладке,тк в этой не особо работает
(почему-то башка появляется,только если выполнить на сайтах с простым оформлением ,типа яндекса)
