JavaScript DOM编程艺术 学习笔记（十）用JavaScript实现动画效果

虽然说利用dom技术修改文档的样式信息，用javaScript添加样式信息可以节约精力，总的来说，css仍然是完成这类任务的最佳工具，但是又一个应用领域是目前css尚且无能为力的，那就是动画。

如果我们想随着时间变化不断改变某个元素样式，只能利用javaScript

position属性的值有static,fixed,relative,absolute。默认static

static   意思是有关元素将按照它们在标记里出现的先后顺序出现在浏览器窗口里

relative   含义和static相似，区别是relative元素可以通过float属性从文档的正常顺序里脱离出来，就好像没用占位一样，然后其它元素再正常排列。

absolute  

 设置为absolute可以把元素摆放到容纳它的“容器”的任何位置，这个容器要么是文档本身(即body)，要么是一个有着fixed或者absolute属性的父元素。

这个元素在原始标记里出现的位置与它的显示位置无关，它的显示位置由top,left,right,bottom等决定。

JavaScript的setTimeOut能让某个函数在经过一段预定的时间之后才开始执行。类似oc里的performselector afterDelay

variable = setTimeOut(“function”,interval)  后面的interval是以毫秒为单位的

取消用clearTimeOut(variable)

javaScript的parseInt可以把整型从字符串中提取出来

此例子中moveMessage() 方法会每隔10ms再次调用此方法 一直移动到到达目的地才return

当需要许多张预览图的时候，可以把那些图片做成一个大的集体照，然后利用css去展现你想展现的那块像素。

css的overflow属性用来处理一个元素的尺寸超出其容器尺寸的情况。

overflow属性有4个可取的值:visible, hidden, scroll, auto

visible: 不裁剪溢出的内容，浏览器将把溢出的内容呈现在容器显示区域以外，全部内容都可见

hidden：隐藏溢出内容，只有一部分可见

scroll：类似于hidden，多个滚动条，可以滚动看到内容的其它部分

auto：类似于scroll，如果没有内容溢出就不显示滚动条。而scroll有无内容溢出都显示滚动条