-
1、浮動布局 2、絕對定位和相對定位 3、遮罩層透明度變化 4、css3動畫效果：transition 5、用偽類實現鼠標懸停時陰影的控制 6、在IE瀏覽器與標準瀏覽器下，綁定事件的區別 7、target 8、通過改變<li>的className實現最終效果查看全部
-
用css3實現平滑過渡：.wrapper ul * { transition:all linear 100ms;}查看全部
-
元素的明暗度是控制遮罩層的透明度實現的。 .wrapper:hover .mask { opacity:0.15;} 鼠標懸停的列表項：.wrapper li.big a:hover .mask { opacity:0;}查看全部
-
【虛線的實現方法】 .line { position:absolute; right:0px; width:0px;height:128px;border:1px dashed #ccc;} 由于只需要虛線邊框的效果，故該元素的寬度為0。 【遮罩層】 .mask { position:absolute; top:0px; left:0px; height:128px; width:156px; opacity:0; background:#000;} 遮罩層的寬度和高度與列表項的寬高一樣，設置背景色和透明度。 為處于展開狀態的列表項設置class，單獨寫效果。 讓為展開的圖片超出列表項一點。img { right:-15px;}查看全部
-
n個列表項總寬度 = （n-1）*列表項寬度 + 1*展開的列表項寬度查看全部
-
浮動布局； 通過設置一個遮罩層的透明度來改變某個元素的明暗度； javascript屬性 / css3的transition 實現動畫效果； 監聽鼠標事件onmouseover。查看全部
-
bind(list[i], 'mouseover', mouseoverHandler);查看全部
-
<p class="price"><i>1</i>折起</p>查看全部
-
function initList(){ //取得外部元素 var outer = document.getElementById('subject'); //取得每個列表項 var list = outer.getElementsByTagName('li'); //用不了，報錯getElementsByTagName of null for(var i =0; i < list.length; i++){ //對每個列表綁定鼠標懸停事件的監聽 bind(list[i], 'mouseover', mouseoverHandler); } }查看全部
-
1浮動 2絕對定位和相對定位 3遮罩層 4動畫效果：transition 5鼠標懸停時陰影的控制查看全部
-
浮動布局 絕對定位與相對定位(position:absolute 與 position:relative) 遮罩層 明暗度的變化(opacity:0.15) CSS3動畫效果——transition(transition:all linear 0.1s) 鼠標懸停時陰影的控制(a:hover{opacity:0;}) 在IE瀏覽器與標準瀏覽器下，綁定事件的區別： function bind(el,eventType,callback){ if(typeof el.addEventListener === 'function'){ el.addEventListener(el,eventType,callback,false); }else if(typeof el.attachEvent === 'function'){ el.attachEvent('on' + eventType,callback); } }查看全部
-
圖片明暗度是根據控制遮罩層的陰影呈現的。opacity屬性查看全部
-
權重越高優先級也就越高查看全部
-
超出的部分隱藏（overflow:hidden） 超出的部分顯示（overflow:visible） 隱藏元素(display:none) 視覺隱藏元素(visibility:hidden)查看全部
-
1/1. 并排顯示的列表如何實現？ A 用div元素絕對定位來實現 B 用div元素display：table來實現 C 用table元素 D 用ul li元素通過左浮動來實現 答案為D，其他方法的確也可以實現，但是都有著各種問題。A答案使用起來不靈活。B答案，是一個取巧的方式但是涉及到兼容性的問題，卻不如D 答案，簡單有效。C 元素有一些弊端, 文檔載入的時候一定要載入完了整個table元素才開始顯示列表，對用戶不友好。D 是最有效，而且兼容性最好的排列方式查看全部
舉報
0/150
提交
取消