Jquery Mouseover динамического р расширение тег

Question

[это еще один вопрос, связанный с чем-то я писал ранее]

У меня есть р тег внутри якоря, там много будет переменное количество экземпляров этого в течение цикла. Моя цель состоит в том, чтобы навести указатель мыши на расширение тэга и показать дополнительную информацию. У меня есть это до сих пор с точки зрения мыши.

$('.boxOPToneplustwo').mouseover(function (e) { 
console.log("in"); 
$('p', this).addClass('popupHighlight') 
}); 

Мне нужно изменить этот код, чтобы р тег, чтобы увеличить его высоту по отношению к количеству текста в элементе. если ему нужны три строки, это увеличит эту сумму и наоборот.

.popupHighlight { 
height: 3.6em !important; 
} 

Как вы можете видеть, что закодированы в данный момент на определенную высоту, есть далеко, чтобы обойти эту проблему?

Answer 1

вы можете сделать это, установив некоторые значения в CSS

.popupHighlight { 
    min-height:100px; 

     overflow:hidden; 
} 

она будет расширяться в соответствии с размером содержания

Answer 2

Эй эта вещь очень легко сделать. Вот скрипка

http://jsfiddle.net/robbiebardijn/vAyn9/

.boxOPToneplustwo{ 
    background-color: red; 
    height: 1em; 
    line-height: 1em; 
    position: relative; 
    overflow: hidden; 
    transition: height 1s ease 
} 

.boxOPToneplustwo.popupHighlight{ 
    height: 3em; 
}