2010年3月2日 星期二

[jquery]提示窗口



// JavaScript Document
(function($) {
$.fn.extend({
Show: function(widht,height) {
var TopY=0;//初始化元素距父元素的距離
$(this).css("width",widht+"px").css("height",height+"px");//設置消息框的大小
$(this).slideDown(1000);//彈出
//$("#messageTool").css("margin-top",-height);//為內容部分創建高度 溢出
$("#message_close",window.parent.frames["main"].document).click(function() {//當點擊關閉按鈕的時候
if(TopY==0)
{
$("#message",window.parent.frames["main"].document).slideUp(1000);//這裡之所以用slideUp是為了兼用Firefox瀏覽器
}
else
{
$("#message",window.parent.frames["main"].document).animate({top: TopY+height}, "slow", function() { $("#message").hide(); });//當TopY不等於0時 ie下和Firefox效果一樣
}
});
$(window).scroll(function() {
$("#message",window.parent.frames["main"].document).css("top", $(window).scrollTop() + $(window).height() - $("#message",window.parent.frames["main"].document).height());//當滾動條滾動的時候始終在屏幕的右下角
TopY=$("#message",window.parent.frames["main"].document).offset().top;//當滾動條滾動的時候隨時設置元素距父原素距離
});
}
})}
)(jQuery);

function ShowMess(MessContent,target)
{
var tit="您有未處理的任務:"; //提示標題
MessContent=MessContent.replace(/\,/g,"<br/>").replace(/white/g,"red");
CreateDiv(tit,MessContent,target);
$("#message",window.parent.frames[target].document).Show(220,150);

}

function CreateDiv(title,content,target)
{
var Div="<div id=\"message\" style=\"z-index:100;position:absolute;display:none;bottom:0; right:0; overflow:hidden;border:1px solid #6699cc\"><div id=\"backimage\"></div><div style=\"width:100%;height:25px;overflow:hidden;background:#6699cc\" id=\"messageTool\"><div style=\"padding:3px 0 0 0px;width:150px;line-height:18px;text-align:center;overflow:hidden;position:absolute;font-size:12px;color:#FFFFFF\" id=\"msgtitle\"><img src=\"/SysImage/radio.gif\" /> "+title+"</div><span id=\"message_close\" style=\"right:10px;width:16px;padding-top:5px;text-align:center;cursor:pointer;position:absolute;\">×</span><div style=\"clear:both;\"></div></div><div id=\"message_content\" style=\"height:150px;text-align:left;overflow:hidden;background:#CFD9F8\"><div style=\"padding:5px;font-size:12px\">"+content+"</div></div></div>";
var Obj = window.parent.frames[target].document.createElement("div");
Obj.innerHTML=Div;
window.parent.frames[target].document.body.appendChild(Obj);
}

//調用方法即可:

ShowMess(message,"main"); //message:需要顯示的信息,main需要顯示的窗口.

【下列文章您可能也有興趣】

沒有留言: