Como faço para limitar a visualização do conteúdo e mantê -la legível

Question

Estou carregando alguns feeds e exibindo -os como links na página do meu site. Quando você passa o mouse sobre o link, uma dica de ferramenta aparece com o feed, o tempo, o autor, o título e o conteúdo. Às vezes, o conteúdo é bastante longo e contém HTML. Por isso, adicionei uma visualização que corta o conteúdo após um certo ponto.

Então, minha pergunta é como determino um bom ponto de interrupção no conteúdo da visualização? No momento, meu conteúdo tem uma tag de imagem que é cortada no meio do URL (meu JavaScript conta apenas para 1000 caracteres no momento) e eu recebo uma imagem quebrada na dica de ferramenta ... Não estou tão preocupado sobre quebrar mesas, mas gostaria da minha prévia para não quebrar a formatação de cores ou as imagens.

Captura de tela do problema:

Código:

content = content.substring(0,1000) +  "...<br><br><span style="float:right;">(Click for more info)</span>";

*Nota: o html no feed às vezes tem <ou> porque existe um código HTML de amostra, bem como tags que formatam o texto ...

Answer 1

Por que não extrair o texto do conteúdo usando o jQuery e mostrar isso na sua dica de ferramenta em vez de mostrar o HTML?

content = $('*',content).text().substring(0,1000) + "...<br><br>...