search

adobe / brackets

An open source code editor for the web, written in JavaScript, HTML and CSS.
http://brackets.io
MIT License
33.27k stars 7.64k forks source link

Scroll to HTML/CSS element using live highlight when element is out of viewport #9938

Open voodoo6 opened 9 years ago

voodoo6 commented 9 years ago

The live highlight feature is great.

However, if the element selected in brackets is out of view in the chrome viewport, chrome should scroll the window to show the elected element.

Thanks!

peterflynn commented 9 years ago

Seems somewhat related to https://trello.com/c/vsSZQjj6/752-live-highlight-more-information.

I imagine we'd want the auto-scroll to be disable-able and/or on a slight delay, since it could be annoying to have the browser view jumping all over as you move your cursor through a CSS file. There's also the question of what to do when there are multiple highlights that don't all fit in view at once...

niutech commented 9 years ago

I support the idea of browser scrolling to the element selected in Brackets + Brackets scrolling to the element selected in browser. Will it be added to the backlog? I don't think it is related to #2232.

garretwilson commented 8 years ago

Is there any progress on this?

siuangie91 commented 6 years ago

Is there a way to disable this actually? It's a great feature but for me the jumping around makes me very dizzy. (I wonder if anyone else is having this issue?)

swmitra commented 6 years ago

@siuangie91 If you are not using experimental live preview then you can set livedev.enableReverseInspect preference to false. This would disable the reverse inspect feature from the next live preview sessions. This preference is added from Brackets 1.11 released today.

siuangie91 commented 6 years ago

@swmitra Thanks for your response. I actually had livedev.enableReverseInspect preference set to false. I was referring to the "regular/forward" inspect; that is, when I click on an element in my HTML file, the browser window scrolls to that element if it's not within the current viewport. I wanted to disable this scrolling if possible. (I downgraded back to Brackets 1.8, where clicking on an element in my HTML file that's not within the browser viewport does not make it scroll to it.)

swmitra commented 6 years ago

@siuangie91 Thanks for clarifying 👍 As of today, Brackets doesn't have the required configuration to disable view port alignment in case of forward inspect. In fact that feature came into existence to resolve reported issues. Not sure if I am convinced of the use case you have explained. If I put my cursor on an element in HTML code, isn't it desirable to make sure that the element I am editing is actually what I intend to edit? And the only way to visually get the confirmation is to see that element in live preview page.

siuangie91 commented 6 years ago

Thanks @swmitra, I agree that the feature is helpful. It's just that sometimes I'm not clicking in Brackets to edit a specific element; rather, I'm clicking to return focus on Brackets app from say, Microsoft Word. When I do that, Brackets' live preview window scrolls to wherever I clicked on, even though I was only clicking on it to return focus on the Brackets editor.

It's the same as G3-Logic's reason on July 25th on #13307 but the other way around.

This frequent scrolling back and forth makes me super dizzy and I have to switch between apps a lot for my work.

Thanks for replying so fast!