Você está usando um navegador desatualizado. Para a visualização correta, atualize seu navegador:

Mapa do site


SimpleUi

Atualizando

Código para Resumo em bloco Download

? - +
Sanfona estilo slide-show e slide-hide após contar tags.
  1. Envolva o texto que você deseja resumir dentro de um elemento com class ui_block, seja em span, div, etc. (esse é o gatilho)
Pronto! Isso é suficiente. Caso queira, você pode customizar a função:
  1. Determine qual será a marcação (tag) divisora:
    • Para isso, use no gatilho o atributo data-tag e informe qual elemento será contado para o resumo, ex: data-tag="<br>" (Padrão)
    • Qualquer tag pode ser usada para determinar o corte
  2. Opcionalmente, indique também qual será o limite de ocorrências da tag escolhida, seja ela a padrão ou a customizada:
    • Use no gatilho o atributo data-num e informe o valor limite, ex: data-num="5" (Padrão)
  3. Também é possível cutomizar o rótulo do gatilho:
    • Use o atributo data-label e indique o rótulo, ex: data-label="Leia Mais" (Padrão)
    • O mesmo vale para o rótulo quando o botão estiver ativo. Nesse caso, use atributo data-label-active e indique o rótulo desejado, ex: data-label-active="Esconder" (Padrão)
  4. Para alterar a posição do gatilho para contrair o conteúdo, use data-trigger-at-the-end="true". Padrão: false.
  5. Outra opção é desabilitar o botão para retrair o conteúdo, ou seja, ao clicar uma única vez para revelar o conteúdo, o botão não estará mais disponível.
    • Para isso, use o atributo data-single-click="true".
  6. Para controlar a velocidade de abertura, use o atributo data-speed.
    • Indique a velocidade (em ms) ou use valores notáveis, como slow, normal (padrão) ou fast.
  7. Também é possível alterar a tag do gatilho, muito útil para aplicar a função dentro de um link sem que esse gere conflito com o <a> em que está contido.
    • Para isso, use o atributo data-element e indique a tag desejada, com a, span, button, etc.
  8. Use o atributo data-anchor="true" no gatilho para ancorar a página até ele quando clicado
  1. Se os atributos não forem usados, a tag padrão será: <br> e o limite 5.
  2. Usuários avançados podem criar funções quando o resumo estiver pronto
    • Para isso, crie a função callready_block()
  3. Após a animação do resumo, também é possível implementar uma função do tipo callback
    • Para isso, crie a função callback_block(obj, objHidden) e implemente as ações que irão ocorrer após a animação
    • Onde obj é o objeto com o texto completo e objHidden é o objeto da parte oculta. Como exemplo, a função pode testar a parte oculta está visível, if(objHidden.is(":visible")){}.
  4. Essas funções não são obrigatórias, ou seja, só serão executadas se existirem. Caso positivo, para evitar duplicidades, lembre-se de implementar as funções callready e callback em arquivos específicos, presentes nas respectivas páginas finais, já que o seu objetivo não é genérico.
Customizar


Conteúdo

. Padrão: false
A marcação sofrerá corte após ocorrências. Padrão: <br> após 5x
Qualquer marcação (tag) pode ser usada no atributo data-tag.

Gatilho

O Rótulo do gatilho será e quando ativo. Padrão: Leia Mais e Esconder
O gatilho para retrair o conteúdo deve ficar . Padrão: Entre o texto
. Padrão: false
A tag do gatilho será . Padrão: Link (<a>) Saiba mais
Com essa alternativa, é possível aplicar a função em links sem que o gatilho interfira e gere conflito com o <a> em que está contido.

Velocidade

A abertura será . Padrão: Normal
Também é possível usar número em milissegundos.
Tem certeza que deseja reiniciar todos os valores?

Resultado para Resumo em bloco