jquery 彈出公告功能代碼

DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jquery 彈出公告功能代碼

jquery 彈出公告功能代碼

編輯：JQuery特效代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>jquery 彈出公告</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><style> 
*{margin:0;padding:0;font-size:12px;} 
li{float:left;width:100px;border:1px solid #ccc;list-style:none;text-align:center;} 
h3{margin:20px auto;text-align:center;} 
input{width:120px;height:30px;cursor:pointer;} 
#notice{position:absolute;width:400px;padding:20px;background:#eee;border:1px solid #ccc;left:10px;top:10px;display:none;} 
</style> 
<script> 
$(function(){ 
$('#open').click(function(){ 
$('#notice').slideDown(); 
$('#texta').val('豪情').select(); 
}); 
$('#closed').click(function(){ 
$('#notice').slideUp(); 
}); 
}); 
</script></head> 
<body> 
<h3> 
<input id="open" type="button" value="彈出公告" />
<input id="closed" type="button" value="關閉公告" /> 
</h3> 
<div id="notice"> 
<textarea name="" id="texta" cols="30" rows="10">
</div>
</body>
</html>

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]

上一頁:jquery 導航條的效果(css選擇器控制)
下一頁:jquery div提示框漸隱彈出與隱藏效果

JQuery特效代碼

jQuery Clone Bug解決代碼: 首先,jQuery事件綁定的時候，所有事件用$.data()方法存儲到了$.cache裡面，用dat
jQuery大於號(>)選擇器的作用解釋: jQuery選擇器中的大於號>作用是什麼:jQuery靈活多樣的選擇器是jQuery的優點之一
jquery 常用操作方法: 操作下拉列表添加選項列表 $(this).get(0).options.add(new Optio

DIV CSS 佈局教程網

相關文章