1. 程式人生 > >跟著老公學習html回顧隨筆JS(*^__^*)

跟著老公學習html回顧隨筆JS(*^__^*)

round eight 元素 cit 父類 for .com mic color

1.position

relative:相對於元素原來的位置的定位

abstract:絕對定位 相對於從屬的父類的定位對於指定的父類的話 父類要加上 relative或abslut屬性

2.animate:從一個狀態 逐漸變為另一個狀態

技術分享

3.eq

:eq() 選擇器選取帶有指定 index 值的元素。

index 值從 0 開始,所有第一個元素的 index 值是 0(不是 1)。

技術分享

選擇p元素的第二個

4.有遮罩層的css彈框

技術分享

html:

<div id="fade">

</div>
<div id="modal">
	<span class="close"  onclick="closeModal()">X</span>
    <p class="modelSpan">
    	我是彈出框,我很帥
        
	</p>
</div>

 css:

#modal{
	position:fixed;
	width:600px;
	height:200px;
	z-index:100;
	font-size:16px;
	text-align:center;	
	left: 33%;
    background-color: white;
    top: 28%;
	display:none;
}	
#fade{
	width:100%;
	height:100%;
	z-index:99;
	position:fixed;
	left:0;
	top:0;
	background-color:#272222;	
	display:none;
	opacity:0.8;
}

5.當前被鼠標覆蓋的元素 改變一些當前元素子類元素的屬性
$(".contentTable li").hover(function(){
		var img=$("img",this);   // 當前元素下的 img
		var href=$("a",this);    //當前元素下的  a
		$(img).attr("src","img/forumIco2.png");   //改變img的src的屬性
		$(href).css("color","#FF8A15");           
		
		},function(){
		var img=$("img",this);
		var href=$("a",this);
		$(img).attr("src","img/forumIco.png");
		$(href).css("color","#2e8a01");
		})
	
	});

  this:當前操作的對象,當前的對象是屬於誰的

原型prototy給一組元素加東西

技術分享

一般來說將參數放構造函數裏,函數放原型裏

技術分享

  

跟著老公學習html回顧隨筆JS(*^__^*)