WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
CSS / Miscellaneous

Tooltips - Round & Oval

— Add-On pour WorldWideScripts.net

@fr1wwsAbonnez-vous à notre RSS pour rester à jour!

Nouveau! Suivez-nous que vous le souhaitez!


Tooltips - Round & Oval - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Le Round & ovale infobulles pop-up pour mettre un sourire sur votre visage!

Elles sont idéales en particulier pour le jeune public (enfants, adolescents), mais pas seulement.

Les sites qui utilisent des formes rondes seront air encore plus cool avec ces info-bulles...

Caractéristiques:

  • 4 en 1: Round Bubbles, Bubbles ovale, infobulles ronde, ovale infobulles
  • design innovant et unique
  • 8 tailles
  • 8 positions
  • autopositionnement plug-in (smarTooltip)
  • 16 combinaisons de couleurs styles
  • 6 modèles bordés
  • une sélection de 13 polices libres frais
  • Transitions CSS3
  • Impressionnant police prête
  • les navigateurs modernes = juste CSS3 + pas d'images + pas de javascript
  • IE 9 = + CSS3 partielle sans images + transitions jQuery
  • IE 8 = images + jQuery
  • 4 fichiers MOINS inclus
  • balisage minimum pour un maximum de CSS
  • 4 fichiers de documentation html détaillées
  • soutien et mises à jour
Vous pouvez mettre des icônes, liens, images à l'intérieur de ces bulles d'aide.

Vous pouvez mettre les infobulles sur les images.

Utilisez-les pour créer des designs surprenants et ludiques.

Vous avez un maximum de contrôle de la façon dont le texte ressemble et est positionné à l'intérieur des bulles d'aide. La taille de l'info-bulle ne change pas automatiquement en fonction de la quantité de contenu que vous ajoutez à l'intérieur. Au lieu de cela, vous devez utiliser l'une des classes de taille 8 pré-faites pour adapter votre contenu à l'intérieur. Vous pouvez faire vos propres classes de taille personnalisée avec les fichiers de moins.

Aussi, je ne les recommande à être utilisé dans un CMS. En raison du fait que vous avez à allign manuellement le contenu à l'intérieur de la bulle, ils ne seraient pas bien travailler avec le contenu généré dynamiquement.

smarTooltip

Le smarTooltip jQuery est un plug-in optionnel que je ai fait. Il est inclus dans cet article. Ces info-bulles fonctionnent parfaitement sans javascript, mais ce plug-in les prend à un nouveau niveau! Le plug-in smarTooltipt présente les caractéristiques suivantes:
  • autopositions tout ou seulement infobulles spécifiques en fonction de leur position temporaire sur le (fenêtre du navigateur) de l'écran
  • définir des restrictions de position (exceptions) pour chaque infobulle qui utilise auto-positionnement.
  • Pas besoin de modifier toute javascript, Tout est fait à l'intérieur du fichier html. Il suffit d'ajouter une classe CSS et un attribut de données.
J'aime vraiment ça. Vérifiez-le!

Compatibilité du navigateur:

  • Firefox 16+
  • Chrome 23+
  • Safari 5.1+
  • Opera 12.1
  • IE 10
  • IE 9: avec des transitions de repli jQuery
  • IE 8: avec images + jQuery repli

droits d'auteur

S'IL VOUS PLAÎT acheter une extension de licence si:
  • vous voulez inclure le code de ce produit à un élément Themeforrest ou Codecanyon

Crédits:

  • MOINS
  • jQuery
  • Icônes: police Impressionnant
  • Google web fonts auteurs
  • Photographes de partout: pour les photos d'enfants Smilling

Mises à jour:

18 Mars:
  • Ajout de la smarTooltip jQuery plug-in (voir ici)
13 Mars:
  • repli ajoutée pour IE 9: transitions jQuery
  • repli ajoutée pour IE 8: images + jQuery

Commentaires et notes sont très appréciés!

Merci

Tudor


Télécharger
D'autres éléments de ce typeTous les composants de cet auteur
CommentairesFoire aux questions et réponses

Propriétés

Créé:
8 Mars 13

Dernière mise à jour:
18 Mars 13

Navigateurs compatibles:
IE8, IE9, IE10, Firefox, Safari, Opera, Chrome

Fichiers inclus:
JS JavaScript, HTML, CSS, MOINS

Une version de logiciel:
CSS3

Mots-clés

commerce é, lectronique, commerce é, lectronique, Tous les articles, bulles, cercle, CSS3, se retirer, innovante, jquery, notification, ovale, rond, intelligent, astuces, infobulle, infobulles, transitions