jquery ui 的一个菜单滑动效果
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><link rel="stylesheet" type="text/css" href="../themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="../themes/icon.css"><script type="text/javascript" src="../jquery-1.3.2.min.js"></script><script type="text/javascript" src="../jquery.easyui.min.js"></script><script type="text/javascript">function setsize(){$('#cc').width(700).height(350);$('#aa').trigger('_resize');}function select(){$('#aa').accordion('select','title1');}</script></head><body><div style="margin-bottom: 10px;"><a href="#" onclick="setsize()">setsize</a><a href="#" onclick="select()">select</a></div><div id="cc" style="overflow:auto;width:600px;height:300px;padding:10px;border:1px solid #ccc;"><div id="aa" fit="true" style="width:300px;height:200px;"><div title="title1" icon="icon-save" style="overflow:auto;padding:10px;"><h3 style="color:#0099FF;">Accordion for jQuery</h3><p>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</p><p>content1</p><p>content1</p><p>content1</p><p>content1</p><p>content1</p><p>content1</p><p>content1</p><p>content12</p></div><div title="我的标题" icon="icon-reload" selected="true" style="padding:10px;">content2</div><div title="title3"></div></div></div></body></html>
?附Jquery.js。。。jqeryui.js
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../themes/icon.css">
<script type="text/javascript" src="../jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="../jquery.easyui.min.js"></script>
<script>
function show1(){
$.messager.show({
title:'My Title',
msg:'Message will be closed after 4 seconds.',
showType:'show'
});
}
function show2(){
$.messager.show({
title:'My Title',
msg:'Message will be closed after 5 seconds.',
timeout:5000,
showType:'slide'
});
}
function show3(){
$.messager.show({
title:'My Title',
msg:'Message never be closed.',
timeout:0,
showType:'fade'
});
}
function alert1(){
$.messager.alert('My Title','Here is a message!');
}
function alert2(){
$.messager.alert('My Title','Here is a error message!','error');
}
function alert3(){
$.messager.alert('My Title','Here is a info message!','info');
}
function alert4(){
$.messager.alert('My Title','Here is a question message!','question');
}
function alert5(){
$.messager.alert('My Title','Here is a warning message!','warning');
}
function confirm1(){
$.messager.confirm('My Title', 'Are you confirm this?', function(r){
if (r){
alert('confirmed:'+r);
location.href = 'http://www.google.com';
}
});
}
function prompt1(){
$.messager.prompt('My Title', 'Please type something', function(r){
if (r){
alert('you type:'+r);
}
});
}
</script>
</head>
<body>
<h1>Messager</h1>
<div>
<a href="javascript:void(0)" onclick="show1()">show</a> |
<a href="#" onclick="show2()">slide</a> |
<a href="#" onclick="show3()">fade</a> |
</div>
<div>
<a href="#" onclick="alert1()">alert</a> |
<a href="#" onclick="alert2()">alert(error)</a> |
<a href="#" onclick="alert3()">alert(info)</a> |
<a href="#" onclick="alert4()">alert(question)</a> |
<a href="#" onclick="alert5()">alert(warning)</a>
</div>
<div>
<a href="#" onclick="confirm1();">confirm</a>
</div>
<div>
<a href="#" onclick="prompt1()">prompt</a>
</div>
</body>
</html> 2 楼 sniciq 2010-01-30 一句说明都没有，截个图也行啊！大哥! 3 楼 dcdc723 2010-01-30 sniciq 写道一句说明都没有，截个图也行啊！大哥!
不好意思。。。发得快了点。。。图已补上~~