用jQuery實現的模仿a的title屬性的例子,在測試的時候ie6,7上出現了層次混亂,不過最終解決了。
html程式碼如下:
程式碼如下:
css程式碼如下
程式碼如下:
* {
margin:0;
padding:0;
}
body {
font-size:12px;
}
.wrap {wrap
width:600px;
margin:100px auto;
}
.clearfix:after, .clearfix:before {
display:table;
content: ""
}
.clearfix:after {
clear:both;
overflow: hidden;
}
.clearfix {
zoom: 1;
}
.
position:relative; //作為定位的父元素,li直接做父元素出現元素內容重疊問題
}
.list li {
list-style:none;
width: 100px;
height:24px;
line-height:24px;
margin-right:10px;
float:left;
}
.list li a { color:#333;
display:block;
}
.show {
position:absolute;
width:100px;
background:#🎜>background:#🎜>background:#🎜>background:#🎜>background:# FFFFE1;
border:1px solid #ffcc01;
padding:6px;
display:none;
z-index:5;
margin-top:10px; //代替top
margin-left:60px; //代替left
}
.show p {
height:18px;
line-height:18px;
}
.list li a: hover {
text-decoration:underline;
color:#FF0000;
}
jQuery程式碼如下
:
預覽效果
;