sur ce site: http://www.eco-environments.co.uk/ si vous faites défiler jusqu'à "Ce que nous faisons" et survolez les liens, vous obtenez un affichage de bulles de bulle, quelqu'un peut-il me dire comment cela est créé s'il vous plaît?CSS/Jquery Effect - Qu'est-ce que c'est?
Merci
Vous pouvez utiliser un plugin jQuery comme jquery tooltips pour ce genre d'effet. Découvrez le demos.
il semble utiliser la Hover.details normale jQuery à http://docs.jquery.com/Events/hover
Il s'agit en fait d'un effet assez simple à créer. D'abord, il y a un div caché dans le code HTML pour l'info-bulle.
<div class="popup" style="display:none;">Hidden Content Here</div>
Ensuite, javascript peut être utilisé pour afficher le contenu caché lorsque quelque chose survole. Par exemple, voici comment cela fonctionnerait en utilisant jQuery (et en utilisant la page d'exemple comme exemple).
$(".tooltip").hover(function(){
$(this).children(".popup").fadeIn(); // Other effects can be used to show the Tooltip
},
function() {
$(this).children(".popup").fadeOut();
});
Le reste est une question d'utiliser les CSS pour vous assurer que l'info-bulle est correctement positionné et rend l'air agréable (dans la plupart des cas de positionnement absolu serait utilisé). Il y a beaucoup de techniques différentes pour faire de belles CSS pour Tooltips, comme toujours Google is your friend.