打开一个框架如何利用jQuery从框架页中关闭,请高手指点下
<html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><scriptt...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/ecmascript" src="jquery-1.4.4.min.js"></script>
<title>测试文档</title>
</head>
<body>
<a href="javascript:a()">test</a>
<div id="a" style="width:100px; height:100px; background:#CCC; display:none;"><iframe src="1.html" width="100" height="100"></iframe></div>
</body>
</html>
<script>
function a(){
$("#a").slideToggle("slow");
}
</script>
1.html内容如下
<script type="text/ecmascript" src="jquery-1.4.4.min.js"></script>
<a href="javascript:aa()">1</a>
<script>
function aa(){
$("#a").slideToggle("slow");
}
</script> 展开
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/ecmascript" src="jquery-1.4.4.min.js"></script>
<title>测试文档</title>
</head>
<body>
<a href="javascript:a()">test</a>
<div id="a" style="width:100px; height:100px; background:#CCC; display:none;"><iframe src="1.html" width="100" height="100"></iframe></div>
</body>
</html>
<script>
function a(){
$("#a").slideToggle("slow");
}
</script>
1.html内容如下
<script type="text/ecmascript" src="jquery-1.4.4.min.js"></script>
<a href="javascript:aa()">1</a>
<script>
function aa(){
$("#a").slideToggle("slow");
}
</script> 展开
2个回答
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<style type="text/css">
body,span,div,td
#bodyL{
float:left;
width:84px;
margin-right:2px;
}
#box{
width:400px;
height:400px;
background:#EDF1F8;
border: 2px solid #849BCA;
margin-top:100px;
margin-left:200px;
float:left;
overflow:hidden;
position:absolute;
left:0px;
top:0px;
cursor:move;
float:left;
/*filter:alpha(opacity=50);*/
}
.content{
padding:10px;
height: 400px;
width: 400px;
}
</style>
<script type="text/javascript" language="javascript">
var timer = 10; //计时器时钟
var HeightEnd=400;//Div高度
var aNum = 20; //步进速度
var isOpen = false;//层状态 打开还是关闭 默认关闭
function $(name)
function voids() {
setTimeout("extend()",66);
}
// 展开/关闭
function extend(){
var otd = document.getElementById("box");
var tHeight = parseInt(gs($("box"),"height"));
if(!isOpen){
$("box").style.display="block";
if (tHeight<HeightEnd){
$("box").style.height=(tHeight+aNum)+"px";
setTimeout("extend()",timer);
}else{
isOpen=true; //打开状态
//$("tabTop").innerHTML = "<input type=\"image\" src=\"Web/img/shaixuan01.gif\" onclick=\"javascript:voids('box');\" onFocus=\"this.blur();\" />";
$("tabTop").value="关闭";;
otd.style.display="block";
}
}else{
if((tHeight-aNum)>0){
$("box").style.height=(tHeight-aNum)+"px";
setTimeout("extend()",timer);
}else{
isOpen=false; //关闭状态
$("box").style.display="none";
// $("tabTop").innerHTML = "<input type=\"image\" src=\"Web/img/shaixuan01.gif\" onclick=\"javascript:voids('box');\" onFocus=\"this.blur();\" />";
$("tabTop").value="打开";
otd.style.display="none";
}
}
}
function gs(d,a){
if (d.currentStyle){
var curVal=d.currentStyle[a]
}else{
var curVal=document.defaultView.getComputedStyle(d, null)[a]
}
return curVal;
}
</script>
<script>
function bbc()
{
var bbb = document.getElementById("bbc");
if(bbb.style.display == "none"){
bbb.style.display="block";
}else{
bbb.style.display="none";
}
}
</script>
<body><input type="button" id="tabTop" onFocus="this.blur();" onclick="javascript:voids('box');" value="打开" />
<div id="box" style="display:none;filter:alpha(opacity=100);opacity:1;">
<div class="content">111111111111111111111</div>
</div>
</body>
</html>
可以把按钮形式换成超链接文字
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<style type="text/css">
body,span,div,td
#bodyL{
float:left;
width:84px;
margin-right:2px;
}
#box{
width:400px;
height:400px;
background:#EDF1F8;
border: 2px solid #849BCA;
margin-top:100px;
margin-left:200px;
float:left;
overflow:hidden;
position:absolute;
left:0px;
top:0px;
cursor:move;
float:left;
/*filter:alpha(opacity=50);*/
}
.content{
padding:10px;
height: 400px;
width: 400px;
}
</style>
<script type="text/javascript" language="javascript">
var timer = 10; //计时器时钟
var HeightEnd=400;//Div高度
var aNum = 20; //步进速度
var isOpen = false;//层状态 打开还是关闭 默认关闭
function $(name)
function voids() {
setTimeout("extend()",66);
}
// 展开/关闭
function extend(){
var otd = document.getElementById("box");
var tHeight = parseInt(gs($("box"),"height"));
if(!isOpen){
$("box").style.display="block";
if (tHeight<HeightEnd){
$("box").style.height=(tHeight+aNum)+"px";
setTimeout("extend()",timer);
}else{
isOpen=true; //打开状态
//$("tabTop").innerHTML = "<input type=\"image\" src=\"Web/img/shaixuan01.gif\" onclick=\"javascript:voids('box');\" onFocus=\"this.blur();\" />";
$("tabTop").value="关闭";;
otd.style.display="block";
}
}else{
if((tHeight-aNum)>0){
$("box").style.height=(tHeight-aNum)+"px";
setTimeout("extend()",timer);
}else{
isOpen=false; //关闭状态
$("box").style.display="none";
// $("tabTop").innerHTML = "<input type=\"image\" src=\"Web/img/shaixuan01.gif\" onclick=\"javascript:voids('box');\" onFocus=\"this.blur();\" />";
$("tabTop").value="打开";
otd.style.display="none";
}
}
}
function gs(d,a){
if (d.currentStyle){
var curVal=d.currentStyle[a]
}else{
var curVal=document.defaultView.getComputedStyle(d, null)[a]
}
return curVal;
}
</script>
<script>
function bbc()
{
var bbb = document.getElementById("bbc");
if(bbb.style.display == "none"){
bbb.style.display="block";
}else{
bbb.style.display="none";
}
}
</script>
<body><input type="button" id="tabTop" onFocus="this.blur();" onclick="javascript:voids('box');" value="打开" />
<div id="box" style="display:none;filter:alpha(opacity=100);opacity:1;">
<div class="content">111111111111111111111</div>
</div>
</body>
</html>
可以把按钮形式换成超链接文字
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
