WebScrap

July 19, 2009

FirefoxでGoogle Chrome風ステータスバー

Google Chromeのステータスバーを真似る

上のものを自分用にアレンジ。変更点は下記の通り。


  • 外観・配置の調整
  • ステータスパネルを非表示。代わりにCache Statusのみサーチバーの前に挿入する
// ==UserScript==
// @name           ChromeStatusbarModoki.uc.js
// @namespace      http://d.hatena.ne.jp/Griever/
// @include        main
// ==/UserScript==
(function(){
var popup = document.getElementById('mainPopupSet').appendChild(document.createElement('panel'));
popup.setAttribute('id', 'ChromePopup');
var label = popup.appendChild(document.createElement('hbox')).appendChild(document.createElement('label'));
label.setAttribute('id', 'ChromeStatusbar');

gBrowser.mPanelContainer.addEventListener('mouseover', function(e){
var elem = e.target;
do {
if ( !elem.hasAttribute) continue;
if ( elem.hasAttribute('href')){
document.getElementById('ChromeStatusbar').setAttribute('value', document.getElementById('statusbar-display').getAttribute('label'));
document.getElementById('ChromePopup').openPopup(null, "", window.pageXOffset - 2,  window.pageYOffset + window.innerHeight, false, true);
break;
}
} while ( elem = elem.parentNode );
},false);

gBrowser.mPanelContainer.addEventListener('mouseout', function(e){
document.getElementById('ChromePopup').hidePopup();
},false);

var statusBar = document.getElementById('cachestatus-panel');
var bar = document.getElementById('nav-bar' );
var place = document.getElementById('search-container' );
bar.insertBefore(statusBar, place);

document.insertBefore(document.createProcessingInstruction(
'xml-stylesheet',
'type="text/css" href="data:text/css,' + encodeURI(
<![CDATA[
#ChromePopup{
max-width: 1007px !important;
margin-top: -22px !important;
padding: 0px 4px !important;
border: 0 !important;
font: 11px "Trebuchet MS", Tahoma, Verdana !important;
background-color: #666 !important;
color: #fff !important;
opacity: 0.9 !important;
-moz-border-radius: 0px 1px 1px 0px !important;
}
#cs_presence{
font: 1.1em Tahoma !important;
margin: 5px 0 !important;
}
#status-bar{display: none !important;}
]]>.toString()
) + '"'), document.documentElement);
})();

0 Coment:

Post a Comment