Twitter bootstrap boutons apparaissant sur passez la souris sur la ligne du tableau

J'ai un twitter bootstrap table avec un groupe de boutons dans la dernière cellule de chaque ligne.

Twitter bootstrap boutons apparaissant sur passez la souris sur la ligne du tableau

Je veux que ces boutons n'apparaissent que lorsque l'utilisateur place le pointeur sur la ligne. Aussi, lorsque l'utilisateur pointe sur la ligne (pas sur le bouton groupe lui-même) que les icônes devraient apparaître, et lorsqu'il a ensuite plane sur le bouton icônes de groupe doivent être affichées comme des boutons.

Twitter bootstrap boutons apparaissant sur passez la souris sur la ligne du tableau

Ici est un violon avec html mise en page j'utilise http://jsfiddle.net/hDafj/

Et c'est ce que j'ai essayé de faire déjà http://jsfiddle.net/hDafj/2

où est le code que vous avez essayé?
Ajout d'un lien vers la mise en page html.
c'est juste le balisage, qu'avez-vous essayez de faire?
Voici ce que j'ai essayé de faire jsfiddle.net/hDafj/2 Mais il vient d'affiche et masque les boutons. Et je veux qu'elle affiche seulement les icônes sur la ligne de vol stationnaire et de boutons sur le bouton groupe de planer.

OriginalL'auteur Devellar | 2013-06-27

  1. 3

    Bien, je pense que de toute façon vous avez besoin de quelques autres styles ici. J'ai ajouté .btn-group-hover la classe pour faire les boutons " frontières, l'ombre et le fond blanc (de cette façon, ils seront toujours de la même taille). Tous les .icon-white icônes doivent être traités séparément, afin d'éviter leur apparition blanc sur fond blanc sur la ligne, le vol stationnaire. Voici ma solution suggérée: http://jsfiddle.net/hDafj/3/ Mais le seul problème ici c'est qu'il semble bien seuls sur blanc tr arrière-plan.

    Semble bon! Pensez-vous qu'il est possible de le faire fonctionner de la même manière à l'aide de css?
    Je pense que c'est possible, mais dans le cas de l'utilisation de jQuery prise en charge du navigateur, c'est mieux.

    OriginalL'auteur Iurii.K

  2. 7

    Nous pouvons le faire avec CSS

    CSS

    table.table tr td div.btn-group { display:none;}
table.table tr:hover td div.btn-group { display:inline-block;}

    Voici la mise à jour violon

    Merci pour la réponse, mais il n'est pas exactement ce que je voulais. Je le veux pour afficher les icônes uniquement sur la ligne de vol stationnaire et de boutons sur le bouton groupe de planer. S'il vous plaît, voir ce que j'ai essayé de le faire déjà jsfiddle.net/hDafj/2

    OriginalL'auteur Praveen Gowda I V

  3. 0

    essayer cette http://jsfiddle.net/guyisra/hDafj/5/ qui pourrait vous aider à démarrer (il faut pour corriger l'alignement, que vous pouvez d sur votre propre

    utiliser js pour ajouter la classe et le css pour la ligne hover

    $(".btn-group a").hover(function () {
    $(this).addClass("btn");
}, function () {
    $(this).removeClass("btn");
}

);

    css

    .btn-group {
    visibility:hidden;
}
table tr:hover .btn-group {
    visibility:visible;
}
    Merci! Vous avez l'idée. Mais les boutons de sauter sur le vol stationnaire. J'aime la solution donnée par la Iurii.K.

    OriginalL'auteur Nick Ginanto