본문 바로가기

tip

마우스 오버 메뉴 딜레이 팁

반응형
$("#nav > li a").hover(
	// this is called on when the mouse enters a link
	function (e) {
		// this is a variable that contains a HTML DOM object. This makes $this a jQuery object 
		// pointing to the same DOM element
		$this = $(this)
		// this animates the padding-left to 24px in 300 milliseconds
		$this.stop().animate({
			// these are the CSS properties to animate to
			// there are no dashes. padding-left becomes paddingLeft
			paddingLeft : '24px'
		}, {queue:false,duration:300});
	},
 
	// this is called when the mouse leaves the link
	function () {
		// this is a variable that contains a HTML DOM object. This makes $this a jQuery object 
		// pointing to the same DOM element
		$this = $(this)
		// this animates the padding-left back to 12px (the original value) in 300 milliseconds
		$this.animate({
			// these are the CSS properties to animate to
			// there are no dashes. padding-left becomes paddingLeft
			paddingLeft : '12px'
		}, {queue:false,duration:300});
	}
);
반응형