2014-04-06 2 views
1

(LiveHeaders 및 방화 광과 유사) 탐색 도구 모음에 추가 버튼 (이 tutorial (Custom_toolbar_button) 기준). 이론적으로파이어 폭스 확장, 나는 파이어 폭스의 "도구 모음 사용자 정의"목록에 표시 할 수있는 버튼을 얻으려고

Customize toolbar http://iforce.co.nz/i/karfnfyi.fze.png

는 브라우저의이 부분을 사용자 정의합니다. 여기

Buttons http://iforce.co.nz/i/gtyq4tkw.3e5.png

내 button.xul 파일입니다

<?xml version="1.0" encoding="UTF-8"?> 
<?xml-stylesheet type="text/css" 
    href="chrome://helloworld/content/button.css" ?> 
<!DOCTYPE overlay> 
<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" id="helloworld-overlay"> 
    <script type="application/javascript" src="chrome://helloworld/content/button.js" /> 
    <!-- Firefox --> 
    <toolbarpalette id="BrowserToolbarPalette"> 
     <toolbarbutton id="custom-button-1" /> 
    </toolbarpalette> 
    <!-- button details --> 
    <toolbarbutton id="custom-button-1" label="Custom" tooltiptext="My custom toolbar button" oncommand="CustomButton[1]()" class="toolbarbutton-1 chromeclass-toolbar-additional custombutton" /> 
</overlay> 

와의 chrome.manifest

content helloworld chrome/ 
style chrome://global/content/customizeToolbar.xul chrome://helloworld/content/button.css 

# Firefox 
overlay chrome://browser/content/browser.xul chrome://helloworld/content/button.xul 

내가 좋은 결과와 함께, XUL 탐색기에 내 button.xul을 테스트했습니다 (그것은 잘 컴파일됩니다). 어떤 이유

XUL explorer Custom Button http://iforce.co.nz/i/uq21lynt.qww.png

, 나는 내가 Firefox 용하려는이 버튼을 추가 할 단지 드릴 수 없습니다. 동일하지만와 부트 스트랩을 수행 할 다른 사람을 위해

답변

1

나는, 모질라 IRC에 #developer의 확장자를 가진 cfx init 동안 만든 main.js (docs를 통해 필요한 Button 명령 또한 cfx xps.

에 의해 생산되고 추가하는 방법을, 나는 개발자에게 말하고 알아 냈 Firefox의 다음 릴리스 (version 29)가 을 사용하여 정보를 추가 할 수있는 기능을 제공 할 것이므로 Navbar에 프로그램을 추가하는 것이 곧 중복 될 것이라고 언급했습니다.

2

는, 당신은 브라우저 레트에 추가해야합니다.

이 요점을 여기에 참조하고, 메모를 읽어 https://gist.github.com/Noitidart/9467045

좋아, 이제 당신이 전혀 생각하지 않아도 편집. 그냥 코드를 복사하여 스크래치 패드에 붙여 넣으십시오. 물론 브라우저 환경에서 실행하십시오.

orrange 큐브가있는 단추를 이미지로 추가 한 후 코드를 실행하여 사용자 정의하고 보게되면 addon bar, toolbar 또는 australis 메뉴 패널로 끌어 올 수 있습니다. 경우 github에 여기에 요점을 붙여

사본은 아래 (웃음)

var doc = document; 
var win = doc.defaultView; 

var toolbox = doc.querySelector('#navigator-toolbox'); 

var button = doc.createElementNS('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'toolbarbutton'); 
button.setAttribute('id', 'bpMyBtn'); 
button.setAttribute('label', 'My Button'); 
button.setAttribute('tooltiptext', 'My buttons tool tip if you want one'); 
button.setAttribute('class', 'toolbarbutton-1 chromeclass-toolbar-additional'); 
button.style.listStyleImage = 'url("https://gist.githubusercontent.com/Noitidart/9266173/raw/06464af2965cb5968248b764b4669da1287730f3/my-urlbar-icon-image.png")'; 
button.addEventListener('command', function() { 
    alert('you clicked my button') 
}, false); 

toolbox.palette.appendChild(button); 

편집 간다 : 버튼을 생성 한 후에는 마지막 위치에 nav-bar로 이동합니다 그래서, 요점에 코드를 업데이트했습니다.

+0

부트 스트랩 방법이 업데이트되었습니다. 왜냐하면 나는 그것이 효과가 있다는 사실을 안다. – Noitidart

+0

복사 붙여 넣기를 시도해보십시오.이 버튼을 추가하기 만하면됩니다. – Noitidart

+0

숟가락으로 그 녀석에게 먹이를 주면이 녀석을 먹을 수 있으므로 스크래치 패드를 생각하지 않고 붙여 넣기를 모두 복사 할 수 있습니다. 지금 그는 붙여 넣기 부분을 복사하고 몇 가지 생각을해야합니다. – Noitidart