标签：
新知识点：
在HTML-Dom中 "style" 属性，是所有HTML标签共有的一个对象属性，这个对象属性可以为元素设置内嵌样式。
style是元素的属性，但是它自身则是一个对象，其写法主要有两点：
· 如果CSS样式没有中划线，则可以直接写成:
Element.style.attributeName
· 如果CSS样式是有中划线的，则写成：
Element.style.attributeName //中划线之后的属性首字母要大写
代码：
HTML：
<ul class="clearfix"> <li class="fl"><img src="xiaojiao.jpg" alt="" width="360" height="270"></li> <li class="fl"><img src="boluo.jpg" alt="" width="360" height="270"></li> <li class="fl"><img src="taozi.jpg" alt="" width="360" height="270"></li> <li class="fl"><img src="mangguo.jpg" alt="" width="360" height="270"></li> </ul>
CSS:
*{margin:0px;padding:0px;list-style:none;} .clearfix:after{display:block;line-height:0;height:0;font-size:0;content:‘‘;clear:both;} .clearfix{*zoom:1;} .fl,.fr{display:inline;} .fl{float:left;} .fr{float:right;} .hide{display:none;} /* Style -Content- */ body,html{width: 100%;height: 100%;overflow:hidden;} ul li{width: 360px;height: 270px;cursor:pointer;}
Jquery：
$(function(){ $(‘ul li‘).mouseover(function(event){ var imgSource = $(this).find(‘img‘).get(0) var Odiv = document.createElement(‘div‘); var Oimg = document.createElement(‘img‘); Oimg.src=imgSource.src; Oimg.alt=imgSource.alt; Odiv.id="Odiv" Odiv.style.verticalAlign="bottom"; Odiv.style.position="absolute"; Odiv.style.left=event.pageX+5+‘px‘; Odiv.style.top=event.pageY+5+‘px‘; Odiv.appendChild(Oimg) document.body.appendChild(Odiv); }).mouseout(function(){ document.body.removeChild(document.getElementById(‘Odiv‘)); }).mousemove(function(event){ var Odiv = document.getElementById(‘Odiv‘); Odiv.style.left=event.pageX+5+‘px‘; Odiv.style.top=event.pageY+5+‘px‘; }) })
标签：
原文地址：http://www.cnblogs.com/HCJJ/p/4803774.html
