Como encontrar o identificador CSS (ou qual é o identificador CSS) para a caixa de hangouts em Hangouts.google.com

Question

Estou usando o widget Web Slice no ambiente de área de trabalho do KDE e estou querendo saber como posso encontrar o identificador CSS (ou o identificador CSS) para a caixa de hangouts em Hangouts.google.com para que eu possa definir o fatia da Web para mostrar apenas essa parte da página.

O widget Informações do Web Slice diz:

The Webslice Widget allows you to display a part of a webpage on your desktop or in a panel. The webslice is fully interactive. Specify the URL of the webpage in the URL field.In the Element to Show field, fill in a CSS identifier (for example #mybox for elements with the id "mybox"). This is the preferred method as it works best with layout changes on the webpage." Alternatively, you can specify a rectangle on the webpage to use as slice. Use "x,y,width,height" in pixels, for example "100,80,300,360". This method is a fallback for webpages that do not provide enough semantic markup for the above mechanism. If both methods (element and geometry) are used, the element will take precedence.

    

Answer 1

O widget de fatia da Web refere-se a um "id" em uma página da Web - isso é literalmente uma tag id="" que pode ser anexada a um elemento div ou qualquer outro.

É melhor testar isso em uma página muito mais simples do que o Hangouts, para que você possa avaliar como ele funciona.

Você precisa usar um navegador com ferramentas de desenvolvedor instaladas, e usarei este site como um exemplo.

À direita da página do Super Usuário, quando você está olhando para uma pergunta, há a barra lateral com metamensagens e perguntas relacionadas. Vamos dizer que você queria um webslice da barra lateral.

Se você clicar com o botão direito na região e escolher "Inspecionar", verá uma visualização do HTML. Subindo do elemento selecionado, você precisa encontrar um elemento que englobe toda a área desejada no webslice.

Você pode ver como isso funciona passando o mouse sobre os elementos - você percorre cada um deles até encontrar um elemento que torna toda a seção azul.

Vocêverá<divid="sidebar" class="show-votes">

Isso cobre toda a barra lateral, portanto, usando o URL dessa pergunta e o id da "barra lateral", você receberá apenas um webslice da barra lateral.

Fazer o mesmo com o Hangouts é complicado. Cada conversa é sua própria página da web de forma eficaz. Se você sair da conversa, verá que ela tem um URL, mas se você pegar o URL e colocá-lo em uma nova janela do navegador, não obterá nada. O mesmo aconteceria com um webslice. Provavelmente não é possível, porque há javascript mantendo o estado, que não é migrado com o URL.

A lista de contatos é igualmente difícil. Está contido em um iframe. O iframe é empacotado dentro de uma div com o id "hangout-landing-chat", então é possível que funcione, mas improvável.

A versão resumida disso é id em um webslice refere-se a um id de um elemento de página da web (como um div) que contém todas as partes da página que você deseja ver - é o pai deles .