jQuert也懂得浪漫 KPD

jQuery也懂得浪漫1、 新建工程文件，将预置图片、音乐、等所需文件放到 jQuery也懂得浪漫中。2、 对当前项目进行html布局 header、 content、 footer3、 头部文字左右弹动 标签 音标m:ki:3-1、marquee 元素（）用来插入一段滚动的文字。可以使用它的属性控制当文本到达容器边缘发生的事情。3-2、3-2-1、behavior设置文本在 marquee 元素内如何滚动。可选值有scroll，slide和alternate。如果未指定值，默认值为scroll。3-2-2、bgcolor通过颜色名称或十六进制值设置背景颜色。3-2-3、direction设置 marquee 内文本滚动的方向。可选值有left,right,upanddown。如果未指定值，默认值为left。3-2-4、height以像素或百分比值设置高度。3-2-5、hspace设置水平边距。3-2-6、loop设置 marquee 滚动的次数。如果未指定值，默认值为1，表示 marquee 将连续滚动.3-2-7、scrollamount设置每次滚动时移动的长度（以像素为单位）。默认值为 6。3-2-8、scrolldelay设置每次滚动时的时间间隔（以毫秒为单位）。默认值为85。请注意，除非指定 truespeed 值，否则将忽略任何小于 60 的值，并改为使用 60。3-2-9、truespeed默认情况下，会忽略小于60的scrolldelay值。如果存在truespeed，那些值不会被忽略。3-2-10、vspace以像素或百分比值设置垂直边距。3-2-11、width以像素或百分比值设置宽度。3-3、元素已经过时，请不要再使用。尽管一些浏览器仍然支持它，但它不是必须的。4、HTML5标签 音标 mbed 4-1、 标签必须有 src 属性。具体属性：详情请见/acooly/archive/2009/03/30/262917.html4-2、所支持的属性属性值描述heightpixels设置嵌入内容的高度。srcurl嵌入内容的 URL。typetype定义嵌入内容的类型。widthpixels设置嵌入内容的宽度。4-3、 标签属性值描述autoplayautoplay如果出现该属性，则音频在就绪后马上播放。controlscontrols如果出现该属性，则向用户显示控件，比如播放按钮。looploop如果出现该属性，则每当音频结束时重新开始播放。preloadpreload如果出现该属性，则音频在页面加载时进行加载，并预备播放。如果使用 autoplay，则忽略该属性。srcurl要播放的音频的 URL。5、perspective 属性5-1、设置元素被查看位置的视图：5-2、perspective 属性定义 3D 元素距视图的距离，以像素计。该属性允许您改变 3D 元素查看 3D 元素的视图。当为元素定义 perspective 属性时，其子元素会获得透视效果，而不是元素本身。注释：perspective 属性只影响 3D 转换元素。提示：请与perspective-origin属性一同使用该属性，这样您就能够改变 3D 元素的底部位置。5-3、目前浏览器都不支持 perspective 属性。Chrome 和 Safari 支持替代的 -webkit-perspective 属性。6、transform 旋转div6-1、兼容性Internet Explorer 10、Firefox、Opera 支持 transform 属性。Internet Explorer 9 支持替代的 -ms-transform 属性（仅适用于 2D 转换）。Safari 和 Chrome 支持替代的 -webkit-transform 属性（3D 和 2D 转换）。Opera 只支持 2D 转换。6-2、语法值描述测试none定义不进行转换。测试matrix(n,n,n,n,n,n)定义 2D 转换，使用六个值的矩阵。测试matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)定义 3D 转换，使用 16 个值的 4x4 矩阵。translate(x,y)定义 2D 转换。测试translate3d(x,y,z)定义 3D 转换。translateX(x)定义转换，只是用 X 轴的值。测试translateY(y)定义转换，只是用 Y 轴的值。测试translateZ(z)定义 3D 转换，只是用 Z 轴的值。scale(x,y)定义 2D 缩放转换。测试scale3d(x,y,z)定义 3D 缩放转换。scaleX(x)通过设置 X 轴的值来定义缩放转换。测试scaleY(y)通过设置 Y 轴的值来定义缩放转换。测试scaleZ(z)通过设置 Z 轴的值来定义 3D 缩放转换。rotate(angle)定义 2D 旋转，在参数中规定角度。测试rotate3d(x,y,z,angle)定义 3D 旋转。rotateX(angle)定义沿着 X 轴的 3D 旋转。测试rotateY(angle)定义沿着 Y 轴的 3D 旋转。测试rotateZ(angle)定义沿着 Z 轴的 3D 旋转。测试skew(x-angle,y-angle)定义沿着 X 和 Y 轴的 2D 倾斜转换。测试skewX(angle)定义沿着 X 轴的 2D 倾斜转换。测试skewY(angle)定义沿着 Y 轴的 2D 倾斜转换。测试perspective(n)为 3D 转换元素定义透视视图。测试7、 animation 将动画与div绑定7-1、定义和用法animation 属性是一个简写属性，用于设置六个动画属性：animation-nameanimation-durationanimation-timing-functionanimation-delayanimation-iteration-countanimation-direction注释：请始终规定 animation-duration 属性，否则时长为 0，就不会播放动画了。7-2、语法值描述animation-name规定需要绑定到选择器的 keyframe 名称。animation-duration规定完成动画所花费的时间，以秒或毫秒计。animation-timing-function规定动画的速度曲线。animation-delay规定在动画开始之前的延迟。animation-iteration-count规定动画应该播放的次数。animation-direction规定是否应该轮流反向播放动画。8、 keyframes 使div匀速运动8-1、定义和用法通过 keyframes 规则，能够创建动画。创建动画的原理是，将一套 CSS 样式逐渐变化为另一套样式。在动画过程中，能够多次改变这套 CSS 样式。以百分比来规定改变发生的时间，或者通过关键词 from 和 to，等价于 0% 和 100%。0% 是动画的开始时间，100% 动画的结束时间。为了获得最佳的浏览器支持，应该始终定义 0% 和 100% 选择器。注释：请使用动画属性来控制动画的外观，同时将动画与选择器绑定。9、 让照片一Z轴为中心 进行360度旋转 同时匹配照片个数transform:rotateY(+deg*i+deg) translateZ(216px)10、 将文字追加到id值为text的div当中，并且每间隔100毫秒出现一个字。window.onload=function typing()/获取divvar mydiv=document.getElementById(text);mydiv.innerHTML+=str.charAt(i);i+;var id=setTimeout(typing,100);if(i=str.length)clearTimeout(id);11、 为了让当前效果更美观 ，给现有页面添加雪花飘落效果。setInterval(function()var sizeflak = minSize+Math.random()*maxSize; /产生大小不等的雪花var startLeft = Math.random()*dw; /雪花生成是随机的left值var startopcity = 0.7+Math.random()*0.3; /随机透明度var endpositionTop= dhight-100; /雪花停止top的位置var endLeft= Math.random()*dw; /雪花停止的left位置var durationfull = 5000+Math.random()*3000; /雪花飘落速度不同flak.clone().appendTo($(body).css(left:startLeft ,opacity:startopcity,font-size