首頁 > web前端 > html教學 > 在input中實現點點點與滑鼠移上去時顯示剩餘的字

在input中實現點點點與滑鼠移上去時顯示剩餘的字

WBOY
發布: 2016-09-30 09:23:10
原創
1406 人瀏覽過

專案中常常會遇到這個問題,在一個內容框中,由於框的寬度是固定的,但是裡面的內容卻有很多,那麼這個時候需求裡就要求第一,多餘的字要以點點點的形式隱藏,第二,當滑鼠移上去的時候要以title提示的方式顯示文字方塊裡的所有內容。實現的方式如下

點點點,文字溢出之前有寫到。將文字方塊新增以下樣式

    display:inline-block;   //這個看情況加
    white-space:nowrap;    //必須
    overflow:hidden;     //必須
    text-overflow:ellipsis;    //必須
而title提示則要在input添加以下程式碼,這樣既可實現用title提示文字方塊中所有內容
 
補充:
剛發現在ie8中,select用這個方法還不能正常的提示文字,太矯情了,最後修改了半天,寫了個函數調用才正常顯示
<script></script>

function selbox(a){
var val = a.val();
a.attr("title",val);
}

話說這意思不是跟行內式一樣樣的麼?為什麼ie8要用這個才能顯示呢?在ie8中input是可以正常顯示的,唯獨select不能正常顯示,非得這麼調用一下才行,有知道是為啥麼?
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板