摘要:
拖拽:小方塊跟著鼠標拖拽走。 原理:1.先計算出鼠標按下的點距小方塊左邊緣與上邊緣的距離,這是一個固定的值。而這個值也很好計算:用 當前鼠標的坐標 - 當前小木塊的offsetLeft/offsetTop 2.確定出這個固定距離,每次鼠標移動會產生新的距離,使小方塊的定位left,top為鼠標當前的
閱讀全文
摘要:
默認行為:瀏覽器自帶的 (如:點擊鼠標右鍵出現一個菜單) 阻止默認行為: document.oncontextmenu=function() { return false;} 修改默認行為: <!DOCTYPE html><html lang="en"><head> <meta charset="U
閱讀全文
摘要:
在講述鼠標事件之前先講一個對象--event: event對象代表事件的狀態,比如事件在其中發生的元素、鍵盤按鍵的狀態、鼠標的位置、鼠標按鈕的狀態。 事件通常與函數結合使用,函數不會在事件發生前被執行. 例子:event事件:點擊任何位置顯示當前位置的橫縱坐標。 <!DOCTYPE html><ht
閱讀全文
摘要:
事件冒泡:一個事件會順著他的層級一直往上傳,一直傳到document上為止,即從盒模型上看是從內到外的過程。 例: <!DOCTYPE html><html lang="en" onclick="alert('html')"><head> <meta charset="UTF-8"> <title>
閱讀全文
摘要:
多物體運動框架: 1.多個盒子同時運動:move(obj,target)多一個參數 <!DOCTYPE html><html><head> <title></title> <style type="text/css"> div{ width: 100px; height: 50px; backgro
閱讀全文
摘要:
display:none與visibility:hidden有一個共同的作用是隱藏要顯示的內容isplay:none 隱藏,但是不占空間 “看不見摸不到” 加載 display:none 隱藏,但是不占空間 看不見摸不到不產生任何框,對布局沒有影響,瀏覽器不顯示其包括其后代元素,更不會占位 visi
閱讀全文
摘要:
javascript的運動非常實用,通過控制需要運動塊的實際距離與要到達的距離的關系,結合定時器來控制小方塊的各種運動。 運動框架 <!DOCTYPE html><html><head> <title></title> <style type="text/css"> #div1{ width: 10
閱讀全文
摘要:
iframe:是框架的一種形式。 屬性: frameborder=0/1 表示是否顯示周圍邊框 0--否 1--是 width,height:設置的邊框寬高,具體數值不需要加單位,也可用百分比 marginwidth:設置顯示的內容的左右邊距;marginheight:設置顯示的內容的上下邊距 bo
閱讀全文
摘要:
對css有一定了解的同學一定聽說過盒模型,在這里以我自己的一點兒了解和認知來解釋一下盒模型與盒模型在低版本IE瀏覽器下與其他瀏覽器下的區別。 W3c標準下的盒模型 盒模型由 content(內容),padding(內填充),border(邊框),margin(外邊距)組成。 對div盒子定義寬高時,
閱讀全文
摘要:
BFC:塊級格式化上下文 占用某一塊的空間位置,主要用于清除內部浮動(防止因浮動脫離文檔流引起的布局錯亂),margin值的嵌套(之前寫過一篇關于margin-top嵌套的解決方法),三列布局(占用空間)。 BFC布局規則:(摘自http://www.rzrgm.cn/lhb25/p/insi
閱讀全文