As dicas de ferramentas redondas e ovais aparecerão para colocar um sorriso no seu rosto!
Eles são ideais especialmente para o público jovem (crianças, adolescentes), mas não apenas.
Sites que usam formas redondas parecerão ainda mais frias com essas dicas de ferramentas…
Características:
- 4 em 1: bolhas redondas, bolhas ovais, dicas de ferramentas redondas, dicas de ferramentas ovais
- design inovador e único
- 8 tamanhos
- 8 posições
- plug-in automático (smartoltip)
- 16 estilos de combinações de cores
- 6 estilos delimitados
- Uma seleção de 13 fontes livres legais
- Transições CSS3
- Fonte incrível pronta
- navegadores modernos = apenas css3 + sem imagens + sem javascript
- Ou seja, 9 = CSS3 parcial + sem imagens + transições jQuery
- Ou seja, 8 = imagens + jQuery
- 4 menos arquivos incluídos
- marcação mínima para CSS máximo
- 4 arquivos de documentação HTML detalhados
- suporte e atualizações
Você pode colocar ícones, links, imagens dentro dessas dicas de ferramentas.
Você pode colocar dicas de ferramentas nas imagens.
Use -os para criar designs surpreendentes e divertidos.
Você tem o controle máximo de como o texto se parece e está posicionado dentro das dicas de ferramentas. O tamanho da dica de ferramenta não muda automaticamente, dependendo de quanto conteúdo você adiciona dentro dele. Em vez disso, você deve usar uma das 8 classes de tamanho pré-fabricadas para se encaixar no seu conteúdo. Você pode fazer suas próprias classes de tamanho personalizado com menos arquivos.
Além disso, eu não recomendo que eles sejam usados em um CMS. Devido ao fato de você ter que alinhar manualmente o conteúdo dentro da dica de ferramenta, eles não funcionariam bem com o conteúdo gerado dinamicamente.
SmartOoltip
O SmartOoltip é um plug-in opcional que eu fiz. Está incluído neste item. Essas dicas de ferramentas funcionam perfeitamente sem JavaScript, mas esse plug-in as leva a um novo nível! O plug-in do SmartOoltipt tem os seguintes recursos:
- AutoPositions todas ou apenas dicas de ferramentas específicas de acordo com sua posição temporária na tela (janela do navegador)
- Defina as restrições de posição (exceções) para cada dica de ferramenta que usa auto -posicionamento.
- Não há necessidade de editar qualquer JavaScript, tudo é feito dentro do arquivo HTML. Basta adicionar uma classe CSS e um atributo de dados.
Eu realmente gosto disso. Confira !
Compatibilidade do navegador:
- Firefox 16+
- Chrome 23+
- Safari 5.1+
- Opera 12.1
- Ou seja, 10
- Ou seja, 9: com fallback de transições de jQuery
- Ou seja, 8: com imagens + fallback jQuery
Direitos autorais
Por favor, compre uma licença estendida se:
- Você deseja incluir código deste item em um item temeforrest ou codecanyon
Créditos:
- MENOS
- jQuery
- Ícones: Fonte incrível
- Autores do Google Web Fontes
- Fotógrafos de todos os lugares: para as fotos de crianças flendo
Atualizações:
18 de março:
- Adicionado o plug-in do SmartOoltip JQuery ( Veja aqui )
13 de março:
- Adicionado fallback para o IE 9: JQuery Transitions
- Adicionado fallback para o IE 8: imagens + jQuery
Comentários e classificação são muito apreciados!
Obrigado
tudor