zk与jQuery结合制作右下角动态特效提示窗口

附件内有必要资源

 

 

  页面代码

 

<!-- 
		不支持ie6
	 -->
	<div id="bottomFixedLayout" sclass="bottom_fixed">
		<div id="_mini_window" sclass="mini_window" visible="false">
			<div sclass="mini_window_title">
				<div style="float:left;font-weight:bold;">
					<image src="/images/new3.gif" />
					新消息
				</div>
				<div align="right" style="float:right;">
					<image src="/images/close.gif" style="margin-top:2px;margin-right:2px;cursor:pointer;"
						w:onClick="jq(this.parent.parent.parent).slideUp('slow');linkFax.isShowMini=false;" />
				</div>
			</div>
			<div sclass="mini_window_content">
				您有一封邮件请点击这里
			</div>
		</div>
	</div>

 

 

 js代码

 

_linkFax = {
		isShowMini : false,
		showMini : function() {
			var $miniWin = jq("$_mini_window");
			$miniWin.slideDown("slow");
			this.isShowMini = true;
		}
	};

 

 

css代码

 

 

<style>
.mini_window {
	width: 300px;
	height: 180px;
	border: 1px solid #86A4BE;
	background-color: #FFFFFF;
}

.mini_window_title {
	height: 20px;
	padding-right: 5px;
	padding-left: 5px;
	background-image: url("../images/column-bg.png");
	background-repeat: repeat-x;
	background-color: #C3E7FB;
}

.mini_window_content {
	padding: 4px;
}
</style>