Search code examples
javascriptjquerydynamic-data

Stack Overflow style expanding tag information?

Regular users of Stack Overflow will have noticed that when you hover over a tag here, a box below the tag will animate open to show more information about it. One of my bosses wants every td tag within one column in a table on our site to do the same thing. Obviously, there are ways to do this using just jQuery to animate open a div or something. Is there a plugin specifically for this that anyone thinks would be better, or a specific way that it should be done using jQuery?

Solution

  • If i were to approach this problem i would use jQuery + jQuery UI. I would create an absolutely positioned div and style it as you like.

    Then using a a jquery hover function you will be able to make this div appear and disappear.

    E.g.

    $("#button").hover(
  function () {
    $("#hidden-div").fadeIn("fast");
  },
  function () {
    $("#hidden-div").fadeOut("fast");
  }
);