2010-11-24 10 views
0

Frage mich, ob jemand einen Rat geben kann.Debugging in Firebug

Basisch ist das etwas, auf das ich von Zeit zu Zeit stoße - ich lerne Debuggen mit Firebug und versuche herauszufinden, wo ein Style-Attribut in einem Komplex von Wordpress/Fancy-Box-Dateien gesetzt wird.

Grundsätzlich versuche ich, fancybox auf die Breite des Elements zu skalieren, ich kenne die fancybox Option, um dies zu aktivieren, aber die ganze Box scheint mit einer festen Breite zu überschreiben, die ich nirgends in der finden kann Stylesheets.

element.style { 
border-width:10px; 
height:84px; 
width:987px; 

Nun, dies nicht über ein Stylesheet auf der rechten Seite zugeordnet ist, in Firebug, so dass ich davon aus, das heißt, seine berechnete on the fly irgendwo in der js/php?

Was ich bin ist ein Zeiger auf, wie man herausfinden kann, wo es gesetzt wird, und wie ich vielleicht Firebug verwenden kann, um das zu identifizieren, wenn es außerhalb der Stylesheets gesetzt wird? es ist so, dass ich ein besserer Debugger auch sein kann :) danke für das Schauen.

Antwort

1

im Mozilla-Browser mit Firebug klicken Sie auf das Pfeilsymbol in (linke obere Ecke) und wählen Sie ein Steuerelement auf der Seite. Es wird ihren Stil (CSS) auf der rechten Seite angezeigt. Hier können Sie Änderungen vornehmen und es wird im Browser angezeigt.

denke, es wird hilfreich für Sie sein.

+0

Hallo, Danke für die Antwort - Ich denke, obwohl ich dies bereits mit Stilen arbeiten, ist das Problem mit diesem speziellen Problem scheint es nicht ein zugeordnetes Stylesheet damit (wenn man in das Panel auf der rechten Seite wo es zeigt den Stil an, nachdem ich auf den Pfeil geklickt habe, was zusammen mit der Tatsache, dass es element.style {} bedeutet, zu der Annahme führt, dass es irgendwo in der js oder php statt in einem Stylesheet fest programmiert ist. Ich würde gerne herausfinden, wo das passiert, indem ich Feuerwanze benutze. Gibt es eine Möglichkeit, das zu tun, denkst du? Prost. – frazzle

0
  1. Sie zuerst das Element lokalisieren
  2. Sobald Sie dies tun, das Ereignis auslösen, werden Sie die Änderung
0

sehen Wenn element.style als Ursprung der Stilinformationen angegeben wird, bedeutet dies, dass der Stil ist inline (dh als Attribut für das Tag angegeben).

z.

<div style='border-width:10px;height:84px;width:987px;>This is a box</div> 

Wenn Sie nicht, dass in den Quellcode sehen können, ist es möglich, sie durch einige Javascript hinzugefügt worden ist

das Addon Web-Entwickler verwenden für Firefox können Sie nicht nur die Quelle sehen zu können, kann die generierte Quelle sehen, die Ihnen die Quelle gibt nach hat Javascript darauf gehandelt.

+0

Hallo, ich kann die Quelle sehen, und der berechnete Stil - was ich danach bin, ist zu sehen, ob es eine Möglichkeit gibt zu identifizieren, in welcher Datei/Zeilennummer das Element angewendet wird, wenn Sie sehen, was ich meine. Im Moment schaue ich mir einfach alle Dateien an, um zu sehen, ob ich einen Sinn für die Anwendung habe. Prost – frazzle