Re: Change CSS on-the-fly

fabrice :

On the "DOM" tab, when you select a tag, you can go the the "Attrs" sub-tab and then modify attribute values by double-clicking on the value.

You can also modify css attributes the same way when selecting a css rule in the dom tree.

This is very limited so far. I plan to add live editing of the rule in the "source" sub-tab in a future release.

I hope that this feature will be in soon, because this is also exactly what I need. Debugging CSS is easy in Firebug, but so far, DebugBar is the closest alternative in IE I've found - and on-the-fly CSS changes are very limited in DebugBar.

Am I right in saying, that on-the-fly editing is only available for class definitions, not id and inline styles?

Re: Change CSS on-the-fly

If you have a webpage loaded and this webpage has JQuery loaded in it, then you can call jquery methods from the debugbar or companion.JS console.As JQuery methods allow to change dom and css attributes on the fly, you can change your page on the fly from DebugBar or Companion.JS console.

Re: Change CSS on-the-fly

Re: Change CSS on-the-fly

Hi,

Under DebugBar, you can select "Script" tab, and the third panel is an edit box where you can enter javascript code.You can then click on "Execute Javascript" button and the javascript code will be executed in the currently loaded page.

Under Companion.JS, you can select "Console" tab and you will have a command line where you can enter javascript code and you will get the result, like the FireBug console.

Re: Change CSS on-the-fly

I hope that this feature will be in soon, because this is also exactly what I need. Debugging CSS is easy in Firebug, but so far, DebugBar is the closest alternative in IE I've found - and on-the-fly CSS changes are very limited in DebugBar.

Re: Change CSS on-the-fly

DOM tab, used the drag/target to select and element on the pageClicked the "Comp. Style" tab Edit the CSS in thereClick the green tick to apply.

- - please let me know if there is quicker/more efficient way

What would be fantastic if this could be done from DOM - Style Sheets, select sheet, "Source" tab. Edit the style sheet then apply (or realtime update) -> I'm used to using Web Developer Tool bar on Firefox and that's the single most useful feature of it, I was hoping I could do something similar with this.

Re: Change CSS on-the-fly

patrickatm4 :

What would be fantastic if this could be done from DOM - Style Sheets, select sheet, "Source" tab. Edit the style sheet then apply (or realtime update) -> I'm used to using Web Developer Tool bar on Firefox and that's the single most useful feature of it, I was hoping I could do something similar with this.