Question

确定。我有css

.rel{
    white-space: nowrap;  
    overflow: hidden;  
    text-overflow: ellipsis;  
    -o-text-overflow: ellipsis;  
        -ms-text-overflow: ellipsis;  
    -moz-binding: url('ff.xml#rel');  
    width: 460px;
    line-height: 15px;
        border-top:dotted 1px #dfdfdf;
}  
 .rel:hover{

overflow:inherit;
white-space: inherit;

    }
.rel:hover .rel_source{
    display: none;
    }

我的HTML是

<div >
                                                <div  class="rel">
                                                <a href="http://feedproxy.google.com/~r/HeraldSunNationalNews/~3/N89EJIdwe9E/story-e6frf7l6-1226207160923">Julia Gillard's anti-wrinkle anti- sadsad anti-wrinkle poasdsadasdasdasasdsd</a>
                                                <div class="rel_source" style="line-height:15px">  Herald Sun | <span class="cat_red">1d 9h ago<span></span> </div> 
                                                </div>
                                                <div  class="rel">
                                                <a href="http://feedproxy.google.com/~r/HeraldSunNationalNews/~3/N89EJIdwe9E/story-e6frf7l6-1226207160923">Julia Gillard's anti-wrinkle poasdsadasdasdas anti-wrinkle poasdsadasdasdas asdasd asdsadsad anti-wrinkle poasdsadasdasdasasdsd asds...</a>
                                                <div class="rel_source" style="line-height:15px">  Herald Sun | <span class="cat_red">1d 9h ago<span></span> </div> 
                                                </div>
                                                <div  class="rel">
                                                <a href="http://feedproxy.google.com/~r/HeraldSunNationalNews/~3/N89EJIdwe9E/story-e6frf7l6-1226207160923">Julia Gillard's anti-wrinkle poasdsadasdasdas anti-wrinkle poasdsadasdasdas asdasd asdsadsad anti-wrinkle poasdsadasdasdasasdsd asds...</a>
                                                <div class="rel_source" style="line-height:15px">  Herald Sun | <span class="cat_red">1d 9h ago<span></span> </div> 
                                                </div>                                                                                                          
                                    </div>

所以我正在做的是，我隐藏了rel_source以显示溢出的文本（rel）。我不想要的是隐藏rel_source，如果.rel没有溢出。任何解决方案???

Answer 1

$(document).on("mouseover", ".rel ", function(){ 

if ($('a',this).text().length< 90)
{ // error here?
    $(this).addClass("rel_shorty");
   $(this).removeClass("rel")
   }

 });

CSS

 .rel_shorty{
        width: 470px;
    line-height: 15px;
        border-bottom:dotted 1px #dfdfdf;
    }

如果发生溢出，则在悬停时删除类

1 个答案: